jQuery單選按鈕如何禁用文本字段而不影響其他

Question

我需要幫助。 我在jquery中遇到問題，當您單擊單選按鈕時，它不應受其他按鈕的影響。

這是我的代碼：

<script>
    jQuery("input[type='radio']").change(function(){
        if(jQuery(this).val() == "Not Vote Anyone")
        {
            jQuery( ".txtfield" ).prop( "disabled", false );
        } else {
            jQuery( ".txtfield" ).prop( "disabled", true );
        }
    });
</script>

網站：

http://devsrver.com/

Answer 1

如果使用選擇器input[type='radio'] ，它將影響所有單選按鈕。 您可以這樣嘗試：

<script>
    jQuery("input[name='radio-743']").change(function(){
       if(jQuery(this).val() == "Not Vote Anyone"){
          jQuery( ".txtfield" ).prop( "disabled", false );
       } else {
          jQuery( ".txtfield" ).prop( "disabled", true );
       }
    });
</script>

Answer 2

您必須在每個差異部分（例如A_Director，B_Director，C_Director）上添加差異屬性。 但是同一部分的屬性相同。 例如：

<input type='radio' groupsection='A_Direction'>Note Vote Anymore
<input type='radio' groupsection='A_Direction'>John Doe
<input type='radio' groupsection='A_Direction'>Jane Doe
<input type='text' groupsection='A_Direction'> 

<input type='radio' groupsection='B_Direction'>Note Vote Anymore
<input type='radio' groupsection='B_Direction'>John Doe
<input type='radio' groupsection='B_Direction'>Jane Doe
<input type='text' groupsection='B_Direction'> 

和javascript應該是：

<script>
    jQuery("input[type='radio']").change(function(){
        var groupsection = $(this).attr('groupsection');
        if(jQuery(this).val() == "Not Vote Anyone")
        {
            jQuery( ".txtfield[groupsection='"+groupsection+"']" ).prop( "disabled", false );
        } else {
            jQuery( ".txtfield[groupsection='"+groupsection+"']" ).prop( "disabled", true );
        }
    });
</script>

Answer 3

我在您的代碼中發現2個問題。

1. input[type='radio']將影響所有radio 。

2. jQuery( ".txtfield" ).prop將影響所有具有類txtfield輸入字段

---

如果您同意修改html和CSS，還有其他一些好的方法，但這只是js代碼中的簡單更改。

---

    jQuery("input[name='radio-743']").change(function(){
       if(jQuery(this).val() == "Not Vote Anyone"){
          jQuery("input[name='RifleDirectorName']").prop( "disabled", false );
       } else {
          jQuery("input[name='RifleDirectorName']").prop( "disabled", true );
       }
    });

同樣，對於radio-744和radio-745您必須這樣做

jQuery("input[name='radio-744']").change(function(){
           if(jQuery(this).val() == "Not Vote Anyone"){
              jQuery("input[name='PistolDirectorName']").prop( "disabled", false );
           } else {
              jQuery("input[name='PistolDirectorName']").prop( "disabled", true );
           }
        });




 jQuery("input[name='radio-745']").change(function(){
               if(jQuery(this).val() == "Not Vote Anyone"){
                  jQuery("input[name='ShotgunDirectorName']").prop( "disabled", false );
               } else {
                  jQuery("input[name='ShotgunDirectorName']").prop( "disabled", true );
               }
            });