Question

我想制作2输入类型=收音机。当我点击第二个单选按钮时，我想按标签“”添加四个按钮。如何在“.innerHTML”中添加输入标签？不要回答JQuery因为这个系统不能使用jquery的append（）方法。

<script type='text/javascript'>
function appendChildDM()
{
  var so = document.createElement('span');
  so.innerHTML="<b> Name:  </b><g:textField name="name" value="${name}" required="true"　maxlength="30" ></g:textField><br><br>";
  so.innerHTML="<b> Company:  </b><g:textField name="company" value="${company}" maxlength="30" ></g:textField><br><br>";
  so.innerHTML="<b>E-mail:  </b><g:textField name="email" required="true" value="${email}"></g:textField><br><br>";
  so.innerHTML="<b>Phone:  </b><g:textField name="phone" value="${phone}"></g:textField>";
 document.getElementById('apch').appendChild(so);
}
</script>

标签中的

   <font size="2"><b>　　System Contact Information:  <input type="radio" name="sessionUserInfo" value="1"  checked="true"/></b>　　　 <b>Name:</b>　${t.memid_name}

  <g:hiddenField name="sessionName" value = "${t.memid_name}" id="subscribeField"/>
  <g:hiddenField name="sessionOrgName" value = "${t.contract_eorg}"/>
  <g:hiddenField name="sessionEmail" value = "${t.memid_email}"/>
  <g:hiddenField name="sessionPhone" value = "${t.memid_home}"/>
  <g:hiddenField name="memdataId" value = "${t.memdata_id}"/>
                    </font>
<br><br>
<div id='apch'>
<font size="2"><p><b>　Other Contact Information:　<input type="radio" name="sessionUserInfo"  value="2" onclick="appendChildDM();"/></b></p><br>

　</font>
</div>

Answer 1

        You can dynamically add en element to the DOM by two ways: by inserting an html code into the parent element or by creating a child element with some properties. In your example the two methods are mixed - therefore senseless.
Method 1. Inserting HTML code:

        var radio = '<input type ="radio" id="' + id + '" value="" />';
        ele.innerHTML = radio;
        document.getElementById(id).onclick = function(){ alert('this is test'); };
Method 2. Creating DOM child:

var radioButton = document.createElement('input');
radioButton.type = "radio";
radioButton.id = id;
radioButton.onclick = function(){ alert('this is test'); };
ele.appendChild(radioButton);

Answer 2

您应该将=替换为+=，并且您已在任何地方放置双引号，这会导致错误。

function appendChildDM(){
  var so = document.createElement('span');

  so.innerHTML = /* because the span is empty */ "<b> Name:  </b><g:textField name='name' value='${name}' required='true'　maxlength='30' ></g:textField><br><br>";
  so.innerHTML += "<b> Company:  </b><g:textField name='company' value='${company}' maxlength='30' ></g:textField><br><br>";
  so.innerHTML += "<b>E-mail:  </b><g:textField name='email' required='true' value='${email}'></g:textField><br><br>";
  so.innerHTML +="<b>Phone:  </b><g:textField name='phone' value='${phone}'></g:textField>";

  // and for the input radio
  so.innerHTML += "<input type='radio' name='theName' /> <input type='radio' name='theName' />";
  document.getElementById('apch').appendChild(so);
}

Answer 3

你正在使用=而不是+ =，使用=将替换你现有的innerhtml。以下是您的期望吗？

<script type='text/javascript'>
function appendChildDM()
{
  var so = document.createElement('span');
  so.innerHTML+="<b> Name:  </b><g:textField name="name" value="${name}" required="true"　maxlength="30" ></g:textField><br><br>";
  so.innerHTML+="<b> Company:  </b><g:textField name="company" value="${company}" maxlength="30" ></g:textField><br><br>";
  so.innerHTML+="<b>E-mail:  </b><g:textField name="email" required="true" value="${email}"></g:textField><br><br>";
  so.innerHTML+="<b>Phone:  </b><g:textField name="phone" value="${phone}"></g:textField>";
 document.getElementById('apch').appendChild(so);
}
</script>

如何在＆＃34; .innerHTML＆＃34;中添加<g：textfield>？</g：textfield>

3 个答案: