1

我希望每当用户将注意力从输入框移出时，它都应该变成只读模式。但是我在运行时生成了所有具有相同类的文本框，我希望这些文本框不应该变成只读模式，直到用户离开该类文本框。但是发生的情况是，一次只能有一个文本框具有焦点，因此同一类的其他文本框最终是只读的。

例如。

<span id="file_div">
<?php foreach($arr as $skill) 
    {echo '<input readonly name="txtSkill[]" value="'.$skill.'" class="txt11"/>'; }?>
</span>
<input type="button" value="Edit" name="btnEdit11"id="btnXyz2" class="btn11"/>

<input readonly name="txtQualif" value="<?= $row[15];?>" class="txt12"/>
<input type="button" value="Edit" name="btnEdit12"id="btnXyz2" class="btn12"/>

<script>
$(".btn11").click(function(){
    $(".txt11").eq(0).focus(); // focus the first
    $(".txt11").prop("readonly", false);
});

$(".btn12").click(function(){
    $(".txt12").focus();
    $(".txt12").prop("readonly", false);
});

$(".txt11").focusout(function(){
    $(".txt11").prop("readonly", true);
});

$(".txt12").focusout(function(){
    $(".txt12").prop("readonly", true);
});
</script>

编辑：

在用户单击不同类名的文本框之前，我不想松开“readonly=false”。在上面的例子中，只要用户在名为 txt11 的类之间单击，所有类名为 txt11 的 texbox 的只读属性应该是 readonly=false。但是如果用户点击类名 txt12 的文本框，那么所有类名 txt11 的文本框都将被设置为只读

4

2 回答 2

1

您需要为每个文本输入字段定义 focusout，因此只要特定输入被聚焦，它就会被更改为 raedonly 模式

$(".txt11").each(function(){
    $(this).focusout(function(){
          $(this).prop("readonly", true);
    });
});
于 2016-11-30T05:48:37.090 回答
0

希望这个JS Fiddle可以为您提供解决方案。

<input type="text" readonly="true" value="123" class="test" id="test"  /><br />
<input class="test" readonly="true" type="text" value="123" />
<button id="editClick">
 Edit
</button>

$("#editClick").on('click', function(){
 $('.test').attr('readonly', false);
});
于 2016-11-30T05:41:28.097 回答