Question

如何设置readonly除用户尝试填充数据的输入外的所有输入？

当用户加载页面index.php并尝试将数据填充到EG：<input id="edValue2" ...>时，我想要只读取除<input id="edValue2" ...>之外的所有输入

但我的代码不起作用，我该怎么办？

的index.php

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<html>
<body>

<form id="form-id" method="post" action="" ENCTYPE = "multipart/form-data" onsubmit="return checkform(this);">
<?PHP
    for ($i=1;$i<=5;$i++)
        {
?>
            <input id="edValue<?PHP echo $i; ?>" type="text" onKeyUp="send_it_register_to_hidden_input<?PHP echo $i; ?>()" onKeyPress="send_it_register_to_hidden_input<?PHP echo $i; ?>()"><br>
<?PHP
        }
?>
    <br>
    <br>
    <br>
    <input type="text" id="lblValue" value="">
    <input type="text" id="lblValue_number" value="">
</form>
</body>



<?PHP
    for ($i=1;$i<=5;$i++)
        {
?>
            <script>
            function send_it_register_to_hidden_input<?PHP echo $i; ?>()
                {
                    lblValue.value = $("#edValue<?PHP echo $i; ?>").val();                    
                    lblValue_number.value = <?PHP echo $i; ?>; 

                    Check_register_it();
                }
            </script> 
<?PHP
        }
?>   





<script>
function Check_register_it()
   {
       $('#form-id input').attr('disabled','disabled'); //disable all
       $(this).removeAttr('disabled'); //enable the one that triggers the event
   }
</script> 




</html>

Answer 1

我强烈建议不要创建这样的功能。它只会使你的代码变得复杂。在这种情况下使用classes，这样您就不需要为每个要操作的ID设置函数：

<body>
<form id="form-id" method="post" action="" ENCTYPE = "multipart/form-data" onsubmit="return checkform(this);">
<?PHP for ($i=1;$i<=5;$i++) { ?>
    <input class="input_boxes" type="text" data-i="<?php echo $i; ?>"><br/>
<?PHP } ?>
    <br>
    <br>
    <br>
    <input type="text" id="lblValue" value="">
    <input type="text" id="lblValue_number" value="">
</form>
</body>

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$('.input_boxes').on('keyup', function(e){
    var value = $(this).val();
    var i_val = $(this).attr('data-i');
    $('#lblValue').val(i_val);
    $('#lblValue_number').val(value);
    $('input').prop('readonly', true);
    $(this).prop('readonly', false);
});
</script>

Answer 2

假设所有输入都是相同元素的子元素（即兄弟），您可以使用jQuery轻松完成此操作：

$('input').on('focus', function(){
    $('input').removeAttr('readonly');
    $(this).siblings().attr('readonly', 'readonly');
});

JSBin： http://jsbin.com/qukohosafuje/1/edit

Answer 3

试试这个： -

  $("input").on('keyup', function () {
        $('input').not(this).attr('readonly', 'readonly');
  });

DEMO

Answer 4

您必须将所有JQuery语句放在：

中

$(function(){
     //put your JQuery code here
});

如果现在有效，请尝试告诉我。

Answer 5

您可以简单地使用readonly的html属性作为您不希望用户填写的输入。 e.g

<input type="text" id="lblValue" value="" readonly>

如果您需要在填写必要的输入后才能访问只读输入，则可以使用jquery来触发事件。

e.g

$('input').keyUp(function(){
    if($('#edValue2').val()!=""){
        $('input:not("#edValue2")').removeAttr('readonly');

}）

如何在用户尝试填充数据的输入旁边设置readonly所有输入？

5 个答案: