9

すべての入力に読み取り専用を追加してから、クリックして読み取り専用を削除して、入力できるようにしようとしています。すべての入力部分の読み取り専用セットは機能しますが、クリック時の削除は機能しません助けてください。

私のコード:

<script language="javascript">
$(document).ready(function()
{
$('#secureFields :input').attr('readonly', true);

    $('.readonly').click(
    function()
    {
        if ($('.readonly').attr("readonly") == true)
        {
            $('.readonly').val('');
            $('.readonly').removeAttr("readonly");
        }           
    }); 
});
</script>

html は次のようになります。

 <table class='table' id='secureFields'  >
        <tr>
            <td width=200>First Name:</td>
            <td><input readonly='readonly'  type='text'  name='firstname' size=30 class='required'/></td>
        </tr>
        <tr>
4

9 に答える 9

9

つまり:

$("input").click(function() {
  if ( $(this).is('[readonly]') ) {
     $(this).removeAttr("readonly");
  } 
});

参照: jsFiddle

于 2012-06-13T07:48:31.297 に答える
4
<html>

 <table class='table' id='secureFields'>
    <tr>
        <td width=200>First Name:</td>
        <td><input type='text'  name='firstname' size=30 class='required'/></td>
    </tr>
</table>

   <button id="btnEnableInputs" type="button">Enable!</button>     

</html>

$(document).ready(function() {

$("#secureFields :input").each(function() {
   $(this).attr("readonly", true);
});

$("#btnEnableInputs").click(function() {
     $("#secureFields :input").each(function() {
          $(this).attr("readonly", false);
     });
 });
});

http://jsfiddle.net/hfK8f/

于 2012-06-13T07:56:37.723 に答える
3

重要な注意: 書きませんlanguage="javascript"が、type="text/javascript"

attribute読み取り専用ではなく、読み取り専用で入力を選択する必要がありclassます。

したがって、次のようにします。

$('input[readonly]').click(

それ以外の

$('.readonly').click(

そして、1行だけ必要です:

$(this).removeProp("readonly");

これは正しいコードです:

$('input[readonly]').click(function(){
     $(this).removeProp("readonly");           
});

Examplefiddleをチェックしてください

参考までに: スクリプトは によって停止されませんreadonly。フィールドの値を設定するだけです...

于 2012-06-13T07:50:38.773 に答える
3

指定したクラスは「必須」であるため、そう$('.readonly').attr("readonly") == trueである必要が $('.required').attr("readonly") == trueあります。

于 2012-06-13T07:44:40.273 に答える
2
comment the script part/**/ to check  readonly  mode

<body> 
<table class='table' id='secureFields'  >
        <tr>
            <td width=200>First Name:</td>
            <td><input readonly="readonly"  type='text'  name='firstname' size=30 class='required'/></td>
        </tr>
       </table>

</body>

<script type="text/javascript">
  $(document).ready(function()
{
$('#secureFields:input').attr('readonly', true);
$('.required').val('');

    $('.required').focus(
    function()
    {
        if ($('.required').attr("readonly") == true)
        {

            $('.required').removeAttr("readonly");
        }           
    }); 
});  
</script>
于 2012-06-13T08:05:16.417 に答える
2

これを試して:

$('input').click(function() {
   $(this).prop('readonly', false)
});
于 2012-06-13T07:45:20.607 に答える
2

これを試して

$(document).ready(function () {
    $('#secureFields :input').attr('readonly', true);
    $('input[readonly]').click(
        function (event) {
        if ($(event.currentTarget).attr("readonly") == "readonly") {
            $(event.currentTarget).removeAttr("readonly");
            $(event.currentTarget).val("");
        }
    });
});

これにより、クリックされた入力の属性が readonly に変更されます。

于 2012-06-13T07:48:40.450 に答える
1

オートコンプリートを防ぐには、入力タグまたはフォームタグにautocomplete = "off"を追加するだけです(両方に設定されている場合は、入力値が優先されるため、個々のタグにautocomplete="on"を使用できます。

とにかく、.selectorは、属性ではなく、特定のクラスを持つ要素を選択します。あなたはできる:

属性セレクターを使用して選択します。input[readonly]を使用して読み取り専用属性が存在する入力を選択するか、input [readonly = "readonly"]を使用して属性がそれ自体に設定されている入力を選択します(最初の入力が優先されます)。

実際、属性が設定されている入力のみを選択する必要はありません。次のように記述して、クリックするとすぐに読み取り専用属性を削除できます。

$('input').click(function(){
  $(this).removeAttr('readonly')
}

それでも、おそらくずっと<input autocomplete ="off"...>が必要です。

于 2012-06-13T07:59:19.487 に答える
1

おそらくあなたは単に欲しい:

$('#secureFields :input').click(function() {
    $('input[readonly]').val('').removeAttr('readonly');        
});

readonlyHTML には CSS セレクターがないため、スクリプトは を参照.readonlyしているため何もしないため、何をしようとしているのかを推測する必要があります。上記は、すべての読み取り専用フィールドを非読み取り専用にし、入力がクリックされると現在の値をクリアします。

于 2012-06-13T07:54:53.507 に答える