Comment obtenir la valeur de l'option sélectionnée dans la zone de sélection à l'aide de jQuery-js tutoriel-php.cn

Comment obtenir la valeur de l'option sélectionnée dans la zone de sélection à l'aide de jQuery

清浅

Libérer： 2019-01-16 14:05:47

original

2615 Les gens l'ont consulté

Vous pouvez utiliser le sélecteur sélectionné dans jQuery pour obtenir l'élément d'option sélectionné. Nous pouvons également sélectionner des options dans la boîte de sélection multiple

Comment obtenir la valeur de l'option sélectionnée dans la zone de sélection à l'aide de jQuery

Dans jQuery : le sélecteur sélectionné. est principalement utilisé pour sélectionner l'élément

Exemple :

Code HTML. :

  <form>
        <label>选择城市：</label>
        <select class="country">
            <option value="合肥">合肥</option>
            <option value="上海">上海</option>
            <option value="北京">北京</option>
        </select>
    </form>

Copier après la connexion

Code jQuery :

$(document).ready(function(){
    $("select.country").change(function(){
        var selectedCountry = $(this).children("option:selected").val();
        alert("你选择的城市是： " + selectedCountry);
    });
});

Copier après la connexion

Le rendu est le suivant :

Comment obtenir la valeur de l'option sélectionnée dans la zone de sélection à l'aide de jQuery

Sélectionner les options dans la zone de sélection multiple

La zone de sélection multiple permet à l'utilisateur de sélectionner plusieurs options, ce qui peut être fait dans la zone de sélection en ajoutant l'attribut multiple au < select> tag Activer plusieurs sections

<script type="text/javascript">
$(document).ready(function() {
    $("button").click(function(){
        var countries = [];
        $.each($(".country option:selected"), function(){            
            countries.push($(this).val());
        });
        alert("你选择的城市有：" + countries.join(", "));
    });
});
</script>
</head>
<body>
    <form>
        <label>选择城市</label>
        <select class="country" multiple="multiple" size="5">
            <option>合肥</option>
            <option>上海</option>
            <option>北京</option>
            <option>南京</option>
            <option>杭州</option>
        </select>
        <button type="button">选择</button>
    </form>

Copier après la connexion

Rendu :

Comment obtenir la valeur de l'option sélectionnée dans la zone de sélection à l'aide de jQuery