如何在jQuery中设置下拉框值

红太狼 2023-02-15 07:50 1阅读 0赞

一个简单的选择/下拉框，其ID为“国家/地区”。

<select id="country">
       <option value="None">-- Select --</option>
       <option value="China">China</option>
       <option value="United State">United State</option>
       <option value="Malaysia">Malaysia</option>
    </select>

1.显示选定的下拉框值。

$('#country').val();

2.将下拉框的值设置为“中国”。

$("#country").val("China");

3.将下拉框值设置为“美国”。

$("#country").val("United State");

4.将下拉框值设置为“马来西亚”。

$("#country").val("Malaysia");

5.要在下拉框中禁用“美国”选项。

$("#country option[value='United State']").attr("disabled", true);

6.要在下拉框中启用“美国”选项。

$("#country option[value='United State']").attr("disabled", false);

## jQuery选择/下拉框示例 ##

<html>
    <head>
    <title>jQuery select / dropdown box example</title>
     
    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
    
    </head>
    
    <body>
    
    <h1>jQuery select / dropdown box example</h1>
    
    <script type="text/javascript">
    
      $(document).ready(function(){
    
        $("#isSelect").click(function () {
    		
    	alert($('#country').val());
    			
        });
    	
        $("#selectChina").click(function () {
    		
    	$("#country").val("China");
    		
        });
    	
        $("#selectUS").click(function () {
    		
    	$("#country").val("United State");
    			
        });
    	
        $("#selectMalaysia").click(function () {
    		
    	$("#country").val("Malaysia");
    
        });
    	
        $("#disableUS").click(function () {
    		
    	$("#country option[value='United State']").attr("disabled", true);
    		
        });
    	
        $("#enableUS").click(function () {
    		
    	$("#country option[value='United State']").attr("disabled", false);
    		
        });
    	
      });
    </script>
    </head><body>
    
    <select id="country">
    <option value="None">-- Select --</option>
    <option value="China">China</option>
    <option value="United State">United State</option>
    <option value="Malaysia">Malaysia</option>
    </select>
    
    <br/>
    <br/>
    <br/>
    
    <input type='button' value='Display Selected' id='isSelect'>
    <input type='button' value='Select China' id='selectChina'>
    <input type='button' value='Select US' id='selectUS'>
    <input type='button' value='Select Malaysia' id='selectMalaysia'>
    <input type='button' value='Disable US' id='disableUS'>
    <input type='button' value='Enable US' id='enableUS'>
    </body>
    </html>

[试试演示][Link 1]

标签： [下拉][Link 2] [jQuery][]

> 翻译自: [https://mkyong.com/jquery/how-to-set-a-dropdown-box-value-in-jquery/][https_mkyong.com_jquery_how-to-set-a-dropdown-box-value-in-jquery]

[Link 1]: http://www.mkyong.com/wp-content/uploads/jQuery/jQuery-select-dropdown-box.html
[Link 2]: https://mkyong.com/tag/dropdown/
[jQuery]: https://mkyong.com/tag/jquery/
[https_mkyong.com_jquery_how-to-set-a-dropdown-box-value-in-jquery]: https://mkyong.com/jquery/how-to-set-a-dropdown-box-value-in-jquery/