情况:
2 个文本框,TextBoxA 和 TextBoxB。我在 TextBoxA 中输入文本,它设置 TextBoxB 的值。现在,我需要能够编辑 TextBoxB 的值,并设置 TextBoxA 的值。足够简单,但我需要它适用于单个页面上的多对文本框。
这是我到目前为止所拥有的:
$(function() {
$(':text').css("border", "1px solid #666"); // Remove for actual app
// Sets value of corresponding textbox by ID
$(':text').blur(function() {
$('#inputval_' + ($(this).attr("id"))).val($(this).val());
});
//Styles all inputs set to read only
$('input[readonly=readonly]').css("border", "none");
$('input[readonly=readonly]').click(function() {// on click allows edit of readonly inputs
if ($(this).attr("readonly") == true) {
$(this).removeAttr("readonly");
$(this).css("border", "1px solid #666");
}
$(this).blur(function() {//on blur sets readonly back to true
if ($(this).attr("readonly") == false) {
$(this).attr("readonly", "readonly");
$(this).css("border", "none");
$('#' + ($(this).attr(("id").remove("inputval_")))).val($(this).val());
}
});
});
});
还有:
<input type="text" id="text1" name="userinput" /><br /><br />
<input type="text" id="text2" name="userinput" /><br /><br />
<input type="text" readonly="readonly" id="inputval_text1" />
<input type="text" readonly="readonly" id="inputval_text2" />
一切正常,除了使第二组文本框影响其相应的对应文本框之外。你能看出我做错了什么吗?我几乎是一个 JavaScript/jQuery 菜鸟(大部分时间都花在 CSS/XHTML 上)所以要温柔一点。
最佳答案
我发现了问题。这是非常微妙的。第二组的选择器需要更改为:
$('#' + ($(this).attr(("id").remove("inputval_")))).val($(this).val());
至:
$('#' + ($(this).attr("id")).replace("inputval_","")).val($(this).val());
关于jQuery:使相应的文本框影响彼此的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/880375/