1

我有一个带有 2 个选择框的页面,其中一个是由 AJAX 调用加载的。然后,我想在启用提交按钮之前使用 jquery/javascript 验证元素。当我更改静态选择(strDirectorate)但无法获取 AJAX 调用加载的下拉列表的值时,jquery 工作正常。

我需要检查人们是否在第二个下拉菜单中选择了任何项目而不是第一个(第一个项目具有空白值)。

我用过 jquery 1.7.2 //我的第一个下拉菜单 100% 准确

//Load Sub Category by Category
$(document).ready(function() {
  $("#category_id").live('change', function() {
    $("#span_sub_category").html( '<img src="<?php echo $base_client;?>images/ajax-loader.gif"/>' );
    $.ajax({
        type: 'POST',
        cache: false,
        url: '<?php echo $base_client;?>ajax-response.php',
        data: 'category_id='+$('#category_id').val()+'&drop_down_name=sub_category_id&operation=load_sub_category',
        success: function(data) {
            if(data){
                var obj = jQuery.parseJSON(data);
                if(obj.response==1){
                    //$('#msg_speaker_login').hide();
                    $('#span_sub_category').hide().html(obj.message).slideDown(1000);
                }else{
                    $('#span_sub_category').hide().html(obj.dd_list).slideDown(1000);
                    table_name="directory_company";
                    prepare_sorting_list();
                }
            }else{
                //JSON unable to return data.
            }
        }
    });
  });
});

这是 ajax 调用加载的下拉列表。

<select name="sub_category_id" id="sub_category_id">
  <option value="">Sub Category</option>
  <option value="2">Mobile Engineers</option>
  <option value="1">Motor EngineersX</option>
  <option value="3">Chemical Engineers</option>
</select>

现在在提交按钮单击事件中,我尝试检查是否加载了 sub_category_id 并选择了非空白值。

$(document).ready(function() {
  $('#btnKeywordSaveUpdate').live('click', function() {
     if(typeof("sub_category_id") != "undefined")
       alert("Sub category not loaded");
     else if($('#sub_category_id').val()=="")
       alert("Please select sub category");
     alert(msg);
  });
});

最后,我的问题是:我总是得到警报(“未加载子类别”);但是我的子类别下拉列表已加载到我的页面中,并且我选择了一个非空白值。那么,我如何检查子类别下拉列表是否已加载到页面中并被选中。

4

2 回答 2

0

首先,不要使用它,live因为它已被弃用。on与代表一起使用。其次,您typeof("sub_category_id")将永远是string,因此您总是看到“未加载子类别”。此外,您应该使用length来检查元素是否存在。考虑到这一点,试试这个:

$(document).on('click', '#btnKeywordSaveUpdate', function() {
    if (!$("#sub_category_id").length) {
        alert("Sub category not loaded");
    }
    else if ($('#sub_category_id').val() == "") {
        alert("Please select sub category");
    }

    alert(msg); // Where does message come from?
});

注意,我document在这里使用了委托处理程序,实际上你应该使用最接近的元素,它不是动态附加的。

于 2013-09-04T07:42:22.853 回答
0

尝试更改if(typeof("sub_category_id") != "undefined")if(typeof("sub_category_id") == "undefined")完全删除它。if(typeof("sub_category_id") != "undefined")无论如何都会返回字符串

将您的代码更改为

$(document).ready(function() {
  $('#btnKeywordSaveUpdate').live('click', function() {
     if($('#sub_category_id').length == 0)
       alert("Sub category not loaded");
     else if($('#sub_category_id').val()=="")
       alert("Please select sub category");
     alert(msg);
  });
});
于 2013-09-04T07:38:11.177 回答