我在按下单选按钮
时尝试更改输入文本它自带的表单有5个选项,带有多个单选按钮和输入文本
我想要更改的输入文本是以不同的形式,因为当更改主窗体中的输入文本时,它应该在另一个上更改
我现在得到这个
$(document).ready(function () {
$("input[type=radio]").click(function () {
$(this).closest('form').find("input[type=text]").val(this.value);
});
});
但这会更改当前表单中的输入文本
如何更改第二个表单输入文本
main form
<form action="cart.php" name="cart" id="cart" target="cart"
method="post" onsubmit="return cart();">
<input name="selector0" type="hidden" value="A">
<input name="selector0hyphen" type="hidden" value="-">
<div class="selector">
<div class="selector">
ccc
</div>
<p>
<label>
<input name="selector1" type="radio" id="selector1_0" value="J" checked="checked">
TYPE : p </label>
<br>
<label>
<input type="radio" name="selector1" value="K" id="selector1_1">
TYPE : l </label>
</p>
<div class="selector">j</div>
<p>
<label>
<input name="selector2" type="radio" id="selector2_0" value="G" checked="checked">
aaa</label>
<br>
<label>
<input type="radio" name="selector2" value="U" id="selector2_1">
u</label>
</p>
<input name="selector2hyphen" type="hidden" value="-">
<div class="selector">bbb</div>
<p>
<label><input name="selector3" type="text" id="selector3" value="000" size="5" maxlength="3">
inches. Please use 3 digit</label></p>
<input name="selector3hyphen" type="hidden" value="-">
<div class="selector"> wd</div>
<p>
<label>
<input name="selector4" type="radio" id="selector4_0" value="S" checked="checked">
24</label>
<br>
<label>
<input type="radio" name="selector4" value="X" id="selector4_1">
22</label>
<br>
<label>
<input type="radio" name="selector4" value="F" id="selector4_2">
21</label>
<br>
<label>
<input type="radio" name="selector4" value="T" id="selector4_3">
211</label>
</p>
<div class="selector">t Type</div>
<p>
<label>
<input name="selector5" type="radio" id="selector5_0" value="1" checked="checked">
33</label>
<br>
<label>
<input type="radio" name="selector5" value="2" id="selector5_1">
3"</label>
<br>
<label>
<input type="radio" name="selector5" value="3" id="selector5_2">
st m</label>
<br>
<label>
<input type="radio" name="selector5" value="4" id="selector5_3">
st</label>
<br>
<label>
<input type="radio" name="selector5" value="5" id="selector5_4">
mm</label>
<br>
<label>
<input type="radio" name="selector5" value="6" id="selector5_5">
mmmf</label>
</p>
<div class="selector">acc</div>
<p>
<label>
<input name="selector6" type="radio" id="selector6_0" value="A" checked="checked">
None</label>
<br>
<label>
<input type="radio" name="selector6" value="B" id="selector6_1">
b</label>
<br>
<label>
<input type="radio" name="selector6" value="C" id="selector6_2">
bb</label>
<br>
<br>
</p>
<p>
<input name="" type="image" value="submit" src="/images/raq.png" style="margin-left:18px;">
</p>
</div>
second form where input should change
<tbody>
<tr>
<th>Model </th>
<td style="width:100%;">
A<input name="selector1" type="text" value="_" maxlength="3">
<input name="selector2" type="text" value="_" maxlength="3">
<input name="selector3" type="text" value="000" maxlength="3">
<input name="selector4" type="text" value="_" maxlength="3">
<input name="selector5" type="text" value="_" maxlength="3">
<input name="selector6" type="text" value="_" maxlength="3">
</td></tr>
</tbody>
所以现在,如果我按下单选按钮,它会以相同的形式更改输入
我需要更改第二个表单上的输入文本
例如我按下类型p它会改变第二种形式的第一个输入文本
谢谢
答案 0 :(得分:1)
您更改输入的表单是第一个表单, 通过添加下一个方法(最近(形式))选择下一个表格 不要忘记表格标签加上他们必须彼此相邻。
$(document).ready(function () {
$("input[type=radio]").click(function () {
$(this).closest('form').next() .find("input[type=text]").val(this.value);
});
});
答案 1 :(得分:1)
find("input[type=text]").val(this.value);
将为您提供所有输入类型=文本,并使用this.value
更新所有内容,您真正想要的是定位特定元素,因此应该是{{1} }
使用.find("input[name=" + this.name + "][type=text]")
查找名称为&#34; xxxx&#34;的最后一个元素和type = text,这将只返回一个结果,因为组合是唯一的
我们的目标是定位您想要更新的单个输入元素,还应该清理代码,属性命令等,如果您不使用它,请删除ID。
更新:更改输入更新单选按钮。
.find("input[name=" + this.name + "][type=text]")
更新文字输入时,您可以将.find("input[type=radio][name=" + this.name + "][value=" + this.value + "]")
与type=radio
和same name
的输入定位,然后使用same value
进行检查。
.prop("checked", true)
&#13;
$(document).ready(function() {
$("input[type=radio]").click(function() {
$(this).closest('body').find("input[name=" + this.name + "][type=text]").val(this.value);
});
$("input[type=text]").on('input', function() {
$(this).closest('body').find("input[type=radio][name=" + this.name + "][value=" + this.value + "]").prop("checked", true);
});
//init
$("input[type=radio]:checked").click();
});
&#13;
答案 2 :(得分:0)
$(this).closest()用于查找最接近的父元素。它只会选择作为$(this)元素父元素的元素。
您应该为文本输入唯一ID,以便轻松识别它们。
改变这个 -
<input name="selector1" type="text" value="_" maxlength="3">
对此 -
<input name="selector1" id="selector1" type="text" value="_" maxlength="3">
然后在jquery中,
$("input[type=radio]").click(function () {
$("#selector1").val(this.value);
});
答案 3 :(得分:0)
为所有表单上的所有单选按钮创建一个onchange
函数。传递函数上单选按钮的值,并从函数中获取值。
例如:
Function myChange(myRadioVal)
{
$("#inputTextBoxId").val(myRadioVal);
//code here
}
答案 4 :(得分:0)
为每个单选按钮添加一个公共类
$(document).ready(function() {
$('.class_name_of_radio').change(function() {
$("input[type=text][name="+this.name+"]").val(this.value);
});
});