Question

我创建了以下插件来说明我的问题。 http://jsbin.com/vorahohali

如何访问插件中选定的id元素？

虽然我当然可以使用插件中的<a>来访问所选的this，但是插件需要能够使用id的任何值和{{{}中的所有值进行通用实现1}}应该在插件外定义。例如，param可能与所选元素（例如id）无关，或者可能与元素相关但不一定与$('#MyID').val()或{{1}相同}}

$(this).data('id')

Answer 1

我从这里拿出一些让我感到困惑的东西，比如ID等功能，但是我通过在所有标签上运行.bla到使用.each（）之类的交换来实现它的工作

$('a').each(function(){$(this).bla(OPTIONS)});

http://jsbin.com/huyesanewa/edit?html,console,output

这样你就可以通过每个.bla函数传递正确的值

Answer 2

不理想，但我想出的最好。我将不胜感激任何建设性的批评。谢谢 http://jsbin.com/zoqugiwohe

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Testing</title>  
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.js" type="text/javascript"></script>
        <script type="text/javascript">

            (function($){
                var defaults = {param: {},};
                var methods = {
                    init : function (options) {
                        var settings = $.extend({}, defaults, options);
                        return this.each(function () {
                            $(this).click(function(e) {
                                for (var elem in settings.param) {
                                    if (typeof settings.param[elem] === "function") {
                                        settings.param[elem]=settings.param[elem](this);
                                    }
                                }
                                console.log(settings.param);
                            });
                        });
                    },
                };

                $.fn.bla = function(method) {
                    if (methods[method]) {return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));}
                    else if (typeof method === 'object' || ! method) {return methods.init.apply(this, arguments);}
                        else {$.error('Method ' +  method + ' does not exist on jQuery.bla');}    
                };

                }(jQuery)
            );
            $(function(){
                $("a").bla({param:{id:function(t){return $(t).data('id')},myInput:$('#myInput').val()},});
            });
        </script>
    </head>
    <body>
        <a href="javascript:void(0)" data-id="How do I get this value?">click</a>
        <input id="myInput" type="hidden" value="My Input Value" />
    </body> 
</html>

如何将参数传递给jQuery插件＆＃34;可能＆＃34;与所选元素相关

2 个答案: