Question

我最近一直在试验Php和CodeIgniter，并创建了一个简单的项目来订购。现在在订购单上有一些选项，用户可以从下拉菜单中选择他/她想要的东西。我设法显示数据库中的可用选项，现在我要做的是，当用户从一个下拉菜单中选择一个选项时，下一个显示选项的下拉菜单中的一个仅与该选择相关联。

例如，比方说用户将购买手机，首先他应该选择品牌，例如三星，现在下一个下拉列表应仅显示来自三星而不是其他品牌的型号。

到目前为止，我所做的是当用户选择品牌时，我在下一个下拉菜单中选择了该品牌的型号，但是如果他单击更多选项，则所有品牌的所有型号都将可用

我已经用javascript完成了。

    {
        if(x == 1)
        { 
            id_mentese = 1; 
        }

        $('#model option:selected').removeAttr('selected');
        $('#model').find('option[value='+id_model+']').attr("selected","selected");
        thistext=$('#model option:selected').text();
        $('.form-control').find('button[data-id="model"]').attr("title",thistext);
        $('button[data-id="model"]').find('.filter-option').text('').text(thistext);
    }

其中x是品牌ID

任何想法如何做到这一点？另外，如果我可以做到这一点，以便如果用户不选择品牌，则模型激活功能将不起作用。预先感谢。

Answer 1

HTML

<select id="brand">
  <option value="none">-- Select a brand --</option>
  <option value="samsung">Samsung</option>
  <option value="htc">HTC</option>
</select>
<select id="cat" style="display:none;">
</select

JS

var models = [
  ["A","C","M","J","H"],
  ["htc1","htc2","htc3"]
]; //load this from database

$("#brand").change(function(){
  var ind = $("#brand option:selected").index();
  if(ind == 0){
    $("#cat").hide();
  }else{
    $("#cat").empty();
    $.each(models[ind + 1], function(key) {
      $("#cat").append($("<option></option>").attr("value", key).text(key));
    });
  }
});

根据另一个选择更改选择选项

1 个答案: