从jQuery函数

Question

我从下面的jQuery函数中获取未定义的输出。我最初将空字符串分配给我的product_type， 当我不选择任何人 时，我希望它是空的，但仍然获得{{ 1}}输出。希望我能在这里得到一些提示。

＆＃13;

＆＃13;

undefined

＆＃13;

$(function () {
    var internal_note = {};
    var customer_note = {};
    var product_type = "";
    var web_camera = "";
    var touch_screen = "";
    $( "#test" ).on("click" , 'button:not(:disabled)',function(event){
        if ($('input[name="product_type"]:checked')){
            product_type = $('input[name="product_type"]:checked').attr("value");
        };
        if($('input[name="web_camera"]:checked')){
           web_camera = $('input[name="web_camera"]:checked').attr("value");
        };
        if($('input[name="touch_screen"]:checked')){
           touch_screen = $('input[name="touch_screen"]:checked').attr("value");
        };
        $('#left_note_list input').each(function(){
            internal_note[this.value] = JSON.stringify($(this).val());
         });
        alert(product_type);
        $.ajax({
        type: "post",
        url: '/insert/',
        data: {
        'internal_note': JSON.stringify(internal_note),
        'product_type': JSON.stringify(product_type),
        'web_camera': JSON.stringify(web_camera),
        'touch_screen': JSON.stringify(touch_screen)
        },
        success: function (data) {
            swal(data,'You Click the Button','success');
            $("#test button:not(:disabled)").text('Done!').attr('disabled', 'disabled');
            },
        error: function(data){
            swal(data.responseText,'You Click the Button', 'error');
        }

        });
    });
});

＆＃13;

＆＃13;

＆＃13;

Answer 1

这是因为您的条件检查永远不会返回false，因此即使未选择任何内容，它也始终指定product_type的值。而不是你的支票，使用这个：

if ($('input[name="product_type"]:checked').length>0){ ... }

正确检查以确保您拥有经过检查的产品类型。

Answer 2

您的问题来自您检查的方式是否已选中复选框。这是检查if ($('input[name="product_type"]:checked'))。这有效，但你没有得到真实或错误的答案，所以你基本上检查真相。您可以检查$('input[name="product_type"]:checked')的长度，也可以执行此操作

$('input[name="product_type"]').is(":checked")

以下是关于如何检查复选框是否已选中的好帖子

jQuery if checkbox is checked

$(function () {
    var internal_note = {};
    var customer_note = {};
    var product_type = "";
    var web_camera = "";
    var touch_screen = "";
    $( "#test" ).on("click" , 'button:not(:disabled)',function(event){

        if ($('input[name="product_type"]').is(":checked")){
            product_type = $('input[name="product_type"]:checked').attr("value");
        }
        if($('input[name="web_camera"]:checked')){
           web_camera = $('input[name="web_camera"]:checked').attr("value");
        }
        if($('input[name="touch_screen"]:checked')){
           touch_screen = $('input[name="touch_screen"]:checked').attr("value");
        }
        $('#left_note_list input').each(function(){
            internal_note[this.value] = JSON.stringify($(this).val());
         });
        alert(product_type);
        $.ajax({
        type: "post",
        url: '/insert/',
        data: {
        'internal_note': JSON.stringify(internal_note),
        'product_type': JSON.stringify(product_type),
        'web_camera': JSON.stringify(web_camera),
        'touch_screen': JSON.stringify(touch_screen)
        },
        success: function (data) {
            swal(data,'You Click the Button','success');
            $("#test button:not(:disabled)").text('Done!').attr('disabled', 'disabled');
            },
        error: function(data){
            swal(data.responseText,'You Click the Button', 'error');
        }

        });
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<div class="col-md-4">
                    <h4 class="sub-header" id="product_type">Product Type</h4>
                        <form>
                            <div class="radio"><label><input type="radio" name="product_type" value="Laptop">Laptop</label></div>
                            <div class="radio"><label><input type="radio" name="product_type" value="Tower">Tower</label></div>
                            <div class="radio"><label><input type="radio" name="product_type" value="Minitower">Minitower</label></div>
                            <div class="radio"><label><input type="radio" name="product_type" value="Small Form Factor">Small Form Factor</label></div>
                        </form>
                  </div><!-- /.col-lg-4  Product Type-->
                  
                <div class="text-center" id="test">
                <button target="_blank"
                    class="btn btn-primary ">
                    Test
                </button>
                </div>