Question

我的网页上有3个选择下拉框，当我在第一个选择框中选择选项时，第二个和第三个选项应该过滤他们的选项，我已经尝试了很多，我的结果是Iam得到改变一个单独选择框，另一个选择框为空。我已经在下面给出了我的代码，请帮助我

代码：

<script type="text/javascript">//<![CDATA[ 
$(window).load(function(){
$("#select1").change(function() { 
if($(this).data('options') == undefined){
/*Taking an array of all options-2 and kind of embedding it on the select1*/
$(this).data('options',$('#select2 option').clone());

} 
var id = $(this).val();
var options = $(this).data('options').filter('[id=' + id + ']');
$('#select2').html(options);
var options = $(this).data('options').filter('[id=' + id + ']');
$('#select3').html(options);
});
});//]]>  
</script>


<form action="send_request.php" name="myForm1" method="post" onsubmit="return(validate1());">
<select class="regtext sec1test" name="select" id="select1" style="width:99%">
<option value="0">Select What?</option>
<option value="1">Features</option>
<option value="2">Video</option>
<option value="3">Buy1</option>
<option value="4">Buy2</option>
</select>
<div class="sec1 lef" >
    <select name="type" class="regtext sec1test" id="select2" style="width:99%">
    <option id="0" value="0">Select genre</option>

<option value="1" id="1">abc</option>
    <option value="2" id="2">models</option>
    <option value="3" id="3">Comp</option>
    <option value="4" id="4">Beat</option>
    </select>
</div>


<div class="sec1 lef" >
    <select name="type" class="regtext sec1test" id="select3" style="width:99%">
    <option id="0" value="0">Select genre</option>
    <option value="1" id="1">abc</option>
    <option value="2" id="2">mod</option>
    <option value="3" id="3">Comp</option>
    <option value="4" id="4">Beat</option>
    </select>
</div>
</form>

我的代码中的错误是什么

Answer 1

以下是解决方案：

jQuery.fn.filterByText = function(textbox, selectSingleMatch) {
    return this.each(function() {
        var select = this;
        var options = [];
        $(select).find('option').each(function() {
            options.push({value: $(this).val(), text: $(this).text()});
        });
        $(select).data('options', options);
        $(textbox).bind('change keyup', function() {
            var options = $(select).empty().data('options');
            var search = $(this).val().trim();
            var regex = new RegExp(search,"gi");

            $.each(options, function(i) {
                var option = options[i];
                if(option.value.match(regex) !== null) {
                    $(select).append(
                       $('<option>').text(option.text).val(option.value)
                    );
                }
            });
            if (selectSingleMatch === true && $(select).children().length === 1) {
                $(select).children().get(0).selected = true;
            }
        });            
    });
};

$(function() {
    $('#select2').filterByText($('#select1'), false);
    $('#select3').filterByText($('#select1'), false);
});

该插件取自本网站： http://www.lessanvaezi.com/filter-select-list-options/

Answer 2

我就是这样做的。请注意，我按Same anwer by bmt - just adding here what i did to verify. package com.requiredAnnotation; import org.springframework.beans.factory.annotation.Required; public class BankService { private CustomerService customerService; private BillPaymentService billPaymentService; @Required public void setCustomerService(CustomerService customerService) { this.customerService = customerService; } @Required public void setBillPaymentService(BillPaymentService billPaymentService) { this.billPaymentService = billPaymentService; } public BillPaymentService getBillPaymentService() { return billPaymentService; } public CustomerService getCustomerService() { return customerService; } } package com.requiredAnnotation; public class CustomerService { } package com.requiredAnnotation; public class BillPaymentService { } <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:aop="http://www.springframework.org/schema/aop" xmlns:context="http://www.springframework.org/schema/context" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd"> <bean id="customerService" class="com.requiredAnnotation.CustomerService" /> <bean id="billPaymentService" class="com.requiredAnnotation.BillPaymentService" /> <bean id="bankService" class="com.requiredAnnotation.BankService"> <property name="customerService" ref="customerService" />  </bean> <bean class="org.springframework.beans.factory.annotation.RequiredAnnotationBeanPostProcessor" /> </beans> package com.requiredAnnotation; import org.springframework.context.ConfigurableApplicationContext; import org.springframework.context.support.ClassPathXmlApplicationContext; public class Test { public static void main(String[] args) { ConfigurableApplicationContext applicationContext = new ClassPathXmlApplicationContext("classpath:com/requiredAnnotation/beans-required.xml"); BankService bankService = applicationContext.getBean(BankService.class); System.out.println("bankService got."); System.out.println("getCustomerService - " + bankService.getCustomerService()); System.out.println("getBillPaymentService - " + bankService.getBillPaymentService()); } }进行过滤，data-id必须是唯一的，并且不适合此类功能。

我不知道内部工作的具体细节，但我非常确定这是使用重复ID并使用过滤器功能的副产品。

＆＃13;

ids

＆＃13;

  var $select1=$("#select1");
  var $select2=$("#select2");
  var $select3=$("#select3");
  $select1.data('options', $select2.html())
  $select1.change(function(){
      var val=$select1.val();
      var options = $($select1.data('options')).filter('[data-id="'+val+'"]');
      $select2.html(options);
      $select3.html(options.clone());
  });

＆＃13;

两个选择选项更改当一个选择框选项更改时

2 个答案: