0

価格のチェックボックスがたくさんありますが、私が試したことは次のとおりです。

誰かが価格/チェックボックスを選択すると、選択した値よりも小さい値が自動的にチェックされます。

JsFiddle

HTML

<div class="prices">
    <input type="checkbox" value="59.99" />59.99
    <input type="checkbox" value="69.99" />69.99
    <input type="checkbox" value="79.99" />79.99
    <input type="checkbox" value="89.99" />89.99
    <input type="checkbox" value="99.99" />99.99
    <input type="checkbox" value="124.99" />124.99
    <input type="checkbox" value="149.99" />149.99
    <input type="checkbox" value="199.99" />199.99
    <input type="checkbox" value="200.00" />200.00
</div>
​

JQUERY

$('.prices input[type=checkbox]').live('click', function (){
     console.log(this);
     $(this).attr('checked', true);
     var chosenPrice = $(this).val();
     console.log(chosenPrice);
     $(".prices input").filter(function(){ 
     return  $(this).attr("value") <=chosenPrice}).attr('checked', true);
});​

いくつかの値を選択しますが、正常に機能していないようです。フィドルをチェックしてください

4

4 に答える 4

2

コードの変更された部分..現在のチェックボックスがオンになっている場合にのみ、他のチェックボックスをオンにする必要があります。また、を使用して文字列を数値に変換する必要があります。

parseFloat()またNumber()

$('.prices input[type=checkbox]').live('click', function() {
    console.log(this);
    var $this = $(this) ;
    if ($this.is(':checked')) {
        var chosenPrice = $this.val();
        console.log(chosenPrice);
        $(".prices input").filter(function() {
            return parseFloat($(this).attr("value")) <= chosenPrice
        }).prop('checked', true);
    }
});​

フィドルをチェック

于 2012-11-12T23:20:41.377 に答える
1

スクリプトは文字列を比較しています。値を変更して数値にしてみてください。

var chosenPrice = Math.floor($(this).val());

http://jsfiddle.net/ppw5z/2/

于 2012-11-12T23:15:39.697 に答える
0

$(this).val()数値ではなく文字列を返すため、実際には数値を比較していません。

値をfloatに変換すると、機能するはずです。

$(document).on('click', '.prices input[type=checkbox]', function() {
    var $this = $(this);
    var value = parseFloat($this.val());

    $this.siblings().andSelf().prop('checked', false).filter(function() {
        return parseFloat($(this).val()) <= value;
    }).prop('checked', true);
});​

デモ： http： //jsfiddle.net/ppw5z/6/

于 2012-11-12T23:20:29.013 に答える
0

コードの問題は、実行される比較がfloatではなく文字列として行われることです。次のコードでこれを修正できます。

$('.prices input[type=checkbox]').live('click', function (){
     var chosenPrice = $(this).val();
     $(".prices input").filter(function(){ 
         return parseFloat($(this).val()) <= parseFloat(chosenPrice)).attr('checked', true);
});​

デモ： JSFiddle

于 2012-11-12T23:23:09.207 に答える