更新:仅根据单选按钮和选项选择某个项目

时间:2015-04-01 19:47:15

标签: javascript jquery

我是JQuery的新手,而且我有点挑剔。我有3个主要的单选按钮设置。这些按钮用于根据所选国家/地区选择项目。

例如,我有6个项目。国内(美国)3,国际(3 =美国)3。

例如:如果我选择first_radio,它还会根据所选的选项选择something-div-0或something-div-1。

JQuery(更新)

<script>
$(document).ready(function() {
$('.something').hide();


$('.somethingName :input').each(function (i, v) {
$(this).attr("id", "something-div-" + i);
i++;
});

$("#option").change(function() {

    var isUS = $("#option:selected").text() === 'UNITED STATES';
    var isNotUS = !isUS;

$(".somethingPick").click(function() {
if(isUS && $("#first_radio").prop('checked') === true){
    $('#something-div-0').click();
} else if(isUS && $("#second_radio").prop('checked') === true){
    $('#something-div-2').click();
} else if(isUS && $("#third_radio").prop('checked') === true){
    $('#something-div-4').click();
} else if(isNotUS && $("#first_radio").prop('checked') === true){
    $('#something-div-1').click(); 
} else if(isNotUS && $("#second_radio").prop('checked') === true){
    $('#something-div-3').click(); 
} else if(isNotUS && $("#third_radio").prop('checked') === true){
    $('#something-div-5').click();
});
});
}); 
</script>

你能告诉我我做错了什么吗?

更新

我在jsfiddle中更新了JQuery。我快到了。我可以让他们中的3个工作。我只需要帮助其他3。

这里也是我的傻瓜:https://jsfiddle.net/mjreno/r99qom5v/31/

1 个答案:

答案 0 :(得分:0)

基本上你的代码有效,但我在加载jQuery 1.6.4时看到错误:

Blocked loading mixed active content into console

真诚地,我不知道为什么会出现这个错误,因此我将jQuery版本更改为最后版本,并且加载时没有任何问题。

但是我稍微编辑了你的代码以使其更清洁

$(document).ready(function() {

var isUS = $("#option").val() === 'UNITED STATES';
var isNotUS = !isUS;

$("#option").change(function() {
    isUS = $("#option").val() === 'UNITED STATES';
    isNotUS = !isUS;
    checkRadio();
});

$(".somethingPick").click(function() {
    checkRadio();
});

function checkRadio() {
    $('.something input[type=radio]').removeAttr('checked');

    if(isUS && $("#first_radio").prop('checked')){
        $('#US_1').click();
    } else if(isUS && $("#second_radio").prop('checked')){
        $('#US_2').click();
    } else if(isUS && $("#third_radio").prop('checked')){
        $('#US_3').click();
    } else if(isNotUS && $("#first_radio").prop('checked')){
        $('#NOTUS_1').click();
    } else if(isNotUS && $("#second_radio").prop('checked')){
        $('#NOTUS_2').click();
    } else if(isNotUS && $("#third_radio").prop('checked')){
        $('#NOTUS_3').click();
    }
}

});

这是JSFiddle