无法使用Jquery添加HTML(输入和单选按钮)

时间:2014-12-11 13:59:13

标签: jquery html

我想在现有的表单/ HTML中添加一个额外的输入文本字段和几个单选按钮。

http://jsfiddle.net/5uto80eu/

请检查以上链接。它在jsfiddle网站上按照我想要的方式工作。但是,当我在我的网站上做同样的事情时,它根本不起作用。

我尝试用简单的东西替换var ExtraNameSearch和var ExtentionsRadio中的html,例如"

test

"它工作正常,但什么时候 我尝试添加我想要显示的html。它不起作用。

任何建议。

代码是

<div class="">
<form action="/" method="GET"  onsubmit="return checkInput(this)">
<input name="gle" type="hidden" value="namecheck" />
<input name="action" type="hidden" value="packtwo" />
<input class="InputText" id="children_name" name="name" type="text"  placeholder="Enter your children name" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter your children name'" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter your children name'"/>
<input class="SubmitButton" type="submit" value="Submit" />
</form>
</div>

脚本

// Add the assets for the namecheck thing
$("#children_name").parent().addClass("Add-Ext-Radio")
function addNameCheckAssets (){
// add and extra search input field 
var ExtraNameSearch = "<input type=\"text\" id=\"name\" name=\"nameholder\" placeholder=\"Enter your children name\" onfocus=\"this.placeholder = ''\" onblur=\"this.placeholder = 'Enter your children name'\" onfocus=\"this.placeholder = ''\" onblur=\"this.placeholder = 'Enter your children name'\"/>";
// add radio buttons for extention selection
var ExtentionsRadio = "<div id='extention-selection'> <span class='extention-radio'>  <input type='radio' id='single' name='childrentype' value='male'> <span>Male</span></span>      |     <span class='extention-radio'><input type='radio' id='single' name='childrentype' value='female'><span>Female</span></span></div>";

// insert the assets
$(ExtraNameSearch).insertAfter( "#children_name" );

// add an ID to the form tag to differentiate
$("#children_name").parent().addClass("Add-Ext-Radio")
$(ExtentionsRadio).insertAfter( "form.Add-Ext-Radio" );
}
// Run addNameCheckAssets function
addNameCheckAssets();

感谢。

1 个答案:

答案 0 :(得分:1)

如果您的代码与jsfiddle完全相同,我能想象的唯一原因是:

您没有将jQuery库链接到HTML中。