その他のラジオオプションを選択した場合

Question

これは予想以上に難しくなっています。私はjqueryセレクタを使用してif/else文を書こうとしています。どのラジオがクリックされたかに応じてメッセージを追加したいと思います。私のロジックは動作しますが、特定のラジオボタンがクリックされたときに出力するメッセージを取得できません。両方の結果を同時に簡単に印刷することはできますが、選択したラジオに応じて別の応答を印刷する方法を理解することはできません。ここで

は私の機能である：

function imageCounter() { 

    var ballCount = 0; 
    var truckCount = 0; 

    // find images with ball in image src 
    $('img[src*=ball]').each(function() { 
    if($(this).attr('src')) { 
     ballCount+=1; 
    }  
    }); 

    // find images with truck in image src 
    $('img[src*=truck]').each(function() { 
    if($(this).attr('src')) { 
     truckCount+=1; 
    } 
    }); 

    if($(':radio[name="truckImages"]:checked')) { 
    $('#radioButtons').append("There are " + truckCount + " truck images."); 
    } else { 
    $('#radioButtons').append("There are " + ballCount + " ball images."); 
    } 
} 

HTML：

<div id="radioButtons"> 
    <input type="radio" value="truckImages" name="truckImages" id="truckImages">Fire Trucks 
    <input type="radio" value="ballImages" name="ballImages" id="ballImages"> 
    <input type="button" value="Count the Images" onclick="imageCounter()"> 
</div> 

Answer 1

私はこの問題は、$の.Fnがクエリに一致する要素の配列を返すことになると思います。要素が一致しない場合、ifは空の配列を返します。 JavaScriptの場合、!![]はtrueを返します。ここでは、.length

if($(':radio[name="truckImages"]:checked').length) { 
    $('#radioButtons').append("There are " + truckCount + " truck images."); 
    } else { 
    $('#radioButtons').append("There are " + ballCount + " ball images."); 
    } 

または

if($(':radio[name="truckImages"]').is(':checked')) { 
    $('#radioButtons').append("There are " + truckCount + " truck images."); 
    } else { 
    $('#radioButtons').append("There are " + ballCount + " ball images."); 
    } 

が実は、私はあなたが$（ 'IMG'）の各関数を呼び出す必要はないと思う使用する必要があります。 （ '：ラジオ[名= "truckImages"]：チェックするには'）$（） `$（）`関数の戻り値がなくても場合*オブジェクトであるため、 `常にtrueになる場合

function imageCount() { 
    var type = $(':radio:checked')).attr('name').replace(/Images$/, ''); 
    var count = $('img[src*=' + type + ']').length; 
    $('#radioButtons').after("There are " + count + " " + type + " images."); 
}