Question

我是从JQuery开始的，我想知道是否有办法将选定项目从选择列表发送到JQuery函数。

所以，这是我用过的小提琴： http://jsfiddle.net/YCPM7/7/

我想知道是否有办法替换我在函数调用中设置的'option：select'。

以下是小提琴代码的一部分：

 <select id="StateSelection1" name="StateSelection">
                <option value="1">state 1</option>
                <option value="2">state 2</option>
                <option value="3">state 3</option>
                <option value="4">state 4</option>
                <option value="5">state 5</option>
            </select>
        </td><td>
            <input type="button" value="envoi" class="bouton" name="test" onclick="switchDiv(1, 'option:select')"/>

你可以在“switchDiv（1，'option：select'）”中看到的'1'并不重要。这是一个由razor（vb.net）生成的id。

Answer 1

轻松做到。首先，为按钮添加ID。我们称之为btnTest。

现在，对于jQuery部分，请使用：

$("#btnTest").click( function() {
    alert($("#StateSelection1 option:selected").text());
});

这将得到select的文本，以获取索引使用val（）而不是text（）

Answer 2

我已经尝试过编辑您在jsfiddle中显示的HTML太多，只添加了.js-target, .js-1和.js-2类来帮助解释正在做什么。

下面的jQuery应该隐藏所有的div，然后当点击其中一个按钮时，再次隐藏它们，只显示选择了该选项的div。

$(".js-target").hide();

$(".bouton").on("click", function() {
    $this = $(this);

    if ($this.hasClass("js-1")) {
        number = "1";
    } else if ($this.hasClass("js-2")) {
        number = "2";
    }

    target = $('#StateSelection' + number + ' option:selected').val();

    $(".js-target").hide();

    $("#" + number + "/" + target).show();
});

fiddle can be viewed here。

Answer 3

一旦你得到了值，你可以使用

$("#btnTest").click( function() {
    $("#StateSelection1").val(YOUR_VALUE);
    }

Answer 4

最后，我选择使用onClick方法执行此操作，这似乎更容易：

  <script type="text/javascript">
      function switchDiv(idCont) {
          value = $('#DivSelection' + idCont + ' option:selected').val();  
        alert("contactid = " + idCont + " DivSelected = " + value);
        $("#" + idCont + "1").hide();
        $("#" + idCont + "2").hide();
        $("#" + idCont + "3").hide();
        $("#" + idCont + "4").hide();
        $("#" + idCont + "5").hide();
        $("#" + idCont + "6").hide();
        $("#" + idCont + "7").hide();
        $("#" + idCont + "8").hide();
        $("#" + idCont + "9").hide();
        $("#" + idCont + value).show();
    };

</script> 

     <input id=@item.idContact type="button" value="Envoyer" class="bouton" onclick="switchDiv(@item.idContact)" />

选择的项目发送到JQuery函数

4 个答案: