1

フォーム入力を無効/有効にするためのオン/オフ スイッチを持つコードがありますが、機能しません。私の入力は常にオフです。何が問題ですか？

<script>  
   function DisEn(X){  
      if(X.checked)Allow=false;  
      else Allow=true;  
      document.A.T1.disabled=Allow;  
      document.A.T2.disabled=Allow;  
   }  
</script>
</head>

<body>
   <form name="A" >
      <span class="toggle-bg">
         <input type="radio" name="toggle" value="off" >
         <input type="radio" name="toggle" value="on">
         <span class="switch"></span>
      </span>
      <input type="text" name="T1" value="A" disabled>  
      <input type="text" name="T2" value="B" disabled>  
   </form>
</body>
</html>
4

2 に答える 2

1

コードロジックを少し変更しましたが、うまくいきます。

ソースコード

<script>  
   function DisEn(X){  
      document.A.T1.disabled=X;
      document.A.T2.disabled=X;
   }  
</script>
</head>

<body>
   <form name="A" >
      <span class="toggle-bg">
         <input type="radio" name="toggle" value="off" onClick="DisEn(false)">
         <input type="radio" name="toggle" value="on" onClick="DisEn(true)">
         <span class="switch"></span>
      </span>
      <input type="text" name="T1" value="A" disabled>  
      <input type="text" name="T2" value="B" disabled>  
   </form>
</body>
</html>

最終結果

仕事中のもの

説明

ラジオ ボタンの 1 つをクリックすると、DisEn関数にブール値が与えられ、disabledそれに応じてパラメーターが設定されます。

于 2013-05-29T04:35:55.463 に答える
0

これは、インラインの onClick を使用しない別の方法です。このため、スクリプトを body タグの末尾に移動して、要素を JavaScript で操作する前に DOM で使用できるようにしました。コードのコメントは、何が起こっているかを説明しています。

バニラ JavaScript

<html>
<head>
</head>
<body>
<form name="A" >
<span class="toggle-bg">
<input type="radio" name="toggle" value="off" >
<input type="radio" name="toggle" value="on">
<span class="switch"></span>
</span>
<input type="text" name="T1" value="A" disabled>  
<input type="text" name="T2" value="B" disabled>  
</form>

<script>

// First, get a collection of the radio inputs with the name 'toggle'
var toggles = document.getElementsByName('toggle');

// Loop through each radio input with the name 'toggle' and add an event listener
// to each toggle input so it knows what to do when a user clicks it.
for (var i = 0; i < toggles.length; i++) {
    toggles[i].addEventListener('click', function(event) {

        // Assign 'Allow' the value of the target. The target will be the radio
        // input that the user clicks. The value is simply the value you have set
        // above in your code - 'on' or 'off'.
        var Allow = event.target.value;

        // Check for the value of 'off' or 'on'
        if (Allow === 'off') {
            // Value is 'off', so disable the text inputs.

            // document.GetElementsByName() returns an array of elements. Because of this,
            // we have to use the [0] after we call it to get the first element in the array.
            // Because each element must have a unique name, this will grab the correct text
            // inputs to target.
            document.getElementsByName('T1')[0].disabled = true;
            document.getElementsByName('T2')[0].disabled = true;
        } else {
            // Value is 'on', so enable the text inputs.

            document.getElementsByName('T1')[0].disabled = false;
            document.getElementsByName('T2')[0].disabled = false;
        }

    }, false);
}

</script>
</body>
</html>

jQuery ソリューション

<html>
<head>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
    $('input:radio[name=toggle]').click(function(event) {
        if (event.target.value == 'on') {
            $('input:text[name=T1], input:text[name=T2]').removeAttr("disabled");
        } else {
            $('input:text[name=T1], input:text[name=T2]').attr("disabled", "disabled");
        }
    });
});
</script>
</head>
<body>
<form name="A" >
<span class="toggle-bg">
<input type="radio" name="toggle" value="off" >
<input type="radio" name="toggle" value="on">
<span class="switch"></span>
</span>
<input type="text" name="T1" value="A" disabled>  
<input type="text" name="T2" value="B" disabled>  
</form>
</body>
</html>
于 2013-05-29T04:52:21.320 に答える