我试图在页面上显示三个项目。前两个不是问题。如果需要更多详细信息,第三个取决于第二个选择选项中选择的内容。第三个选项根据第二个选项隐藏或显示。所以没有问题。代码在这里:
// Create a Javascript class to handle the form.
function InquiryCardForm() {
var objSelf = this;
// Get a jQuery reference to the form.
this.Form = $( "#inqueryCard-form" );
// Get jQuery references to the key fields in our contact
// form. This way, we don't have to keep looking them up.
// This will make it faster.
this.DOMReferences = {
// Form elements
ID: this.Form.find( "input[ name = 'id' ]" ),
SourceCode: this.Form.find( "input[ name = 'sourceCode' ]" ),
SourceValue: this.Form.find( "select[ name = 'source' ]" ),
SourceText: this.Form.find( "input[ name = 'other"
+this.Form.find( "input[ name = 'sourceCode' ]" ).val()
+this.Form.find( "select[ name = 'source' ]").val() +"' ]" )
};
所以我有 HTML:
<form action="" method="post" name="inqueryCard" id="inqueryCard-form">
...
<tr>
<td>
<input type="hidden" name="sourceCode" value="SRCE">
<select id="source" name="source">
<option value="" selected>*** Select ***</option>
<option value="1" data-more="N">Web Search</option>
<option value="2" data-more="N">Word Of Mouth</option>
<option value="3" data-more="O">Other</option>
<option value="4" data-more="R">Other</option>
</select>
</td>
</tr>
<tr>
<td>
<div id="otherDIV_SRCE1">
<p> <input type="text" name="otherSRCE1" value="" /></p>
</div>
<div id="otherDIV_SRCE2">
<p> <input type="text" name="otherSRCE2" value="" /></p>
</div>
<div id="otherDIV_SRCE3">
<p>Please Specify <input type="text" name="otherSRCE3" value="" /></p>
</div>
<div id="otherDIV_SRCE4">
<p>Must Share <input type="text" name="otherSRCE4" value="" /></p>
</div>
</td>
</tr>
这里的问题是 SourceText 对象不是一个对象。我根据“源”的选择隐藏或显示 div。
请注意,我能够在“提交表单”功能上实现此功能,如下所示
var code = objSelf.DOMReferences.SourceCode.val();
var value = objSelf.DOMReferences.SourceValue.val();
var SourceText = objSelf.Form.find( "input[ name = 'other" + code + value + "' ]" );
但我想在 this.DOMReferences 中执行此操作。由于我在此页面上还有大约 21 个其他项目,它们的工作方式与此非常相似。
提前谢谢您。 (第一次发布任何内容,如果我忘记了应该在这里发布的内容,请告诉我)
最佳答案
请更新您的功能:
function InquiryCardForm()
{
var objSelf = this;
this.Form = $( "#inqueryCard-form" );
var select = this.Form.find( "select[ name = 'source' ]" );
this.DOMReferences =
{
// Form elements
ID: this.Form.find( "input[ name = 'id' ]" ),
SourceCode: this.Form.find( "input[ name = 'sourceCode' ]" ),
SourceValue: select ,
SourceText: function()
{
var index = select.find(":selected").val();
return this.Form.find( "input[ name = 'other" + SourceCode.val() + index + "' ]" );
}
};
}
关于javascript - jQuery动态输入另一个Input的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27135723/