如何使選定的收音機輸入不是多個

我有一些無線電輸入。請參閱代碼如何使選定的收音機輸入不是多個

<div class="radio"> 
    <label class="btn btn-time text-center "> 9.30 PM 
     <input type="radio" name="optionsRadios"id="optionsRadios20"value="9.30PM" /> 
    </label> 
</div>

有很多這樣的輸入。我想在用戶點擊一個輸入時添加選定的顏色。爲此，我正在使用這個jQuery代碼

 $(document).ready(function() { 
     $(".btn-time").click(function(){ 
      $(this).css("background", "#DF73AF"); 
      }); 
     });

此代碼解決了問題，但問題是，它給所有點擊輸入相同的顏色。我只想要最後點擊的輸入顏色和其他應該返回到默認值。在此先感謝..

來源

2016-08-15 Hkm Sadek Hossain

試試這個

$(document).ready(function() { 
    $(".btn-time").click(function(){ 
    $(".btn-time").css('background', 'yourColor'); 
    $(this).css("background", "#DF73AF"); 
    }); 
});

這是一個工作示例

$(document).ready(function() { 
 
    $(".btn-time").click(function(){ 
 
    $(".btn-time").css('background', '#FFF'); 
 
    $(this).css("background", "#DF73AF"); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="radio"> 
 
    <label class="btn btn-time text-center "> 9.30 PM 
 
     <input type="radio" name="optionsRadios"id="optionsRadios20"value="9.30PM" /> 
 
    </label> 
 
    <label class="btn btn-time text-center "> 10.30 PM 
 
     <input type="radio" name="optionsRadios"id="optionsRadios20"value="10.30PM" /> 
 
    </label> 
 
    <label class="btn btn-time text-center "> 11.30 PM 
 
     <input type="radio" name="optionsRadios"id="optionsRadios20"value="11.30PM" /> 
 
    </label> 
 
    <label class="btn btn-time text-center "> 12.30 PM 
 
     <input type="radio" name="optionsRadios"id="optionsRadios20"value="12.30PM" /> 
 
    </label> 
 
</div>

來源

2016-08-15 18:56:48

謝謝你soo ..工作完美..我接受你的問題，因爲你先回答.. –

只是重置所有你設置的點擊顏色之前：

$(document).ready(function() { 
    $(".btn-time").click(function(){ 
     $(".btn-time").css('background', '#fff'); // or whatever default color 
     $(this).css("background", "#DF73AF"); 
    }); 
});

來源

2016-08-15 18:56:45

添加代碼以在更新當前之前將bacground更改爲默認值。我建議你將一組元素緩存在一個變量中（我的例子中的myset爲了顯着的性能優勢）。

$(document).ready(function() { 
    var myset = $(".btn-time"); 
    myset.click(function() { 
    myset.css("background", "default_color"); 
    $(this).css("background", "#DF73AF"); 
    }); 
});

來源

2016-08-15 18:58:39 Iceman

對於繼承術語，當然可以放任何顏色。新行重新設置類應用於每個對象的背景顏色。

$(document).ready(function() { 
    $(".btn-time").click(function() { 
    $(".btn-time").css('background', 'inherit'); 
    $(this).css("background", "#DF73AF"); 
    }); 
});

這是解決方案的JSFiddle。

來源

2016-08-15 19:13:44

如何使選定的收音機輸入不是多個

回答

相關問題