Question

我需要将下拉选择值传递给jQuery插件。

HTML：

<html>
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script type="text/javascript" src="jquery.requiredplugin.js"></script>
  </head>
  <body>
    <select name="Type" id="sid">
      <option value="value1">value1</option>
      <option value="value2" selected>value2</option>
      <option value="value3">value3</option>
    </select>
    <textarea name="source" id="src1" cols="150" rows="20"></textarea>
    <script type="text/javascript">
      $("#src1").keyup(function(e) {
        $(this).pluginmethod(e.keycode);
      });
    </script>
  </body>
</html>

jquery.requiredplugin.js：

(function ($) {
  // jQuery plugin definition
  $.fn.pluginmethod = function (keycode) {
    return this.each(function () {
      var $str = $('#src1');
      var $soml = $('#sid');
      var somlan = $soml.val(); //if I assign  var somlan with some static value my code works
      var som = $str.val();
      /* My code goes here where I use both var som and  var somlan*/
    });
  };
})(jQuery);

我能够获得$('#src1')的值，如果为var somlan分配一些静态值，那么我的代码就可以了。但是，如果我想使用下拉列表选择值（其ID为"sid"）并将插件中的值检索为var $soml = $('#sid');，那么我的代码就不起作用。

如何在插件中使用下拉列表选择值？

Answer 1

试试这个：用两个参数而不是一个参数修改你的插件方法，并将select box的值作为第二个参数传递。

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.requiredplugin.js"></script>
</head>
<body>
<select name="Type" id="sid">

                <option value="value1">value1</option>
                <option value="value2" selected>value2</option>
                <option value="value3">value3</option>
                </select>
<textarea name="source" id="src1" cols="150" rows="20"></textarea>
<script type="text/javascript">
$("#src1").keyup(function(e) {
$(this).pluginmethod(e.keycode,$('#sid').val());
});
</script>
</body>
</html>

插件

(function($) {

// jQuery plugin definition

$.fn.pluginmethod = function(keycode, selectVal) {

       return this.each(function() {
       var $str = $('#src1'); 
       //var $soml = $('#sid'); 
       var somlan= selectVal; 
       var som= $str.val();

       /* My code goes here where I use both var som and  var somlan*/

     });
  };

})(jQuery);

Answer 2

在jquery.requiredplugin.js中尝试这样做

(function($) {

$.fn.pluginmethod = function(keycode) {

       return this.each(function() {
       var $str = $('#src1'); 
       var $soml = $('#sid option:selected').text(); 
       var somlan= $soml.val();
       var som= $str.val();

       /* Your code goes here where you use both var som and  var somlan*/

     });
  };

})(jQuery);

希望这有帮助。

Answer 3

你应该尝试：

$("#sid option:selected").text();

或

$("#sid option").is("selected").text()

Answer 4

看起来sormeone已经在jQuery Get Selected Option From Dropdown

问了类似的问题

如果我是对的，这将返回一个对象

var sid = $('#sid').find(":selected");

如何在jquery插件中传递dropdown选中的值

HTML：

jquery.requiredplugin.js：

4 个答案: