Question

 function showHelp(id,help) {

 var node = document.createElement('p') ; 
 var text = document .createTextNode('help') ;
 node.appendChild(text) ;
 document.getElementById('id').appendChild(node) ;
 }

 function makeHelpBack(id,help) {

  return function() { showHelp (id,help) ; } ;
  }

  function setUpHelp () {

   var helpText = [{'id':'name' , 'help':'Please fill your full name'} ,
                {'id':'email', 'help':'Email should contain @ '} ] ;

   for (var i = 0 ; i<helpText.length ; i++) {

    var item = helpText[i] ;
    document.getElementById(item.id).onfocus = makeHelpBack(item.id , item.help) ;
    }
    }

    setUpHelp () ;

在此代码中，错误消息是appendChild of null的属性。

Answer 1

以下是如何操作：

function addHelp(id,help) {
 var node = document.createElement('span'); 
 var text = document .createTextNode(help) ;
 node.appendChild(text);
 node.style.display='none';
 insertAfter( document.getElementById(id), node);
}

function insertAfter(referenceNode, newNode) {
    return referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}

function setUpHelp () {

   var helpText = [
     {'id':'name' , 'help':'Please fill your full name'},
     {'id':'email', 'help':'Email should contain @ '}
   ];

   for (var i = 0 ; i<helpText.length ; i++) {
    addHelp( helpText[i].id, helpText[i].help );
    var item = helpText[i] ;
    document.getElementById(item.id).onfocus = function() { this.nextSibling.style.display='inline' }
  }
}

setUpHelp();

<form>
  <div>
    <input id='name'/>
  </div>
  <div>
    <input id='email'/>  
  </div>
</form>

错误是无法读取appendChild的属性

1 个答案: