如何将一个脚本用于多个 id？答案

【问题标题】：How can use one script for many id's?如何将一个脚本用于多个 id？
【发布时间】：2014-03-14 20:17:19
【问题描述】：

我有这段代码，我需要使用许多 id，不仅是 map1，还有 map1、map2、map3 等等。例如 ($usamap = $('#map_id');) 怎么做？

$usamap = $('#map1');
    function bindlinks() {
        $('*').unbind();
        $("#unbind_link").bind("click", function (e) {
            e.preventDefault();
            $usamap.mapster("unbind");
            $usamap.width(720);
            bindlinks();
        });
        $("#rebind_link").bind("click", function (e) {
            e.preventDefault();
            $usamap.mapster(default_options);
        });

        $("#unbind_link_preserve").bind("click", function (e) {
            e.preventDefault();
            $usamap.mapster("unbind", true);
            bindlinks();
        });
        $("#tooltip").bind("click", function (e) {
            e.preventDefault();
            var state = !$usamap.mapster('get_options').showToolTip;
            $('#tooltip_state').text(state ? "enabled" : "disabled");
            $usamap.mapster("set_options", { showToolTip: state });
        });
        $("#single_select").bind("click", function (e) {
            e.preventDefault();
            var state = !$usamap.mapster('get_options').singleSelect;
            $('#single_select_state').text(state ? "enabled" : "disabled");
            $usamap.mapster("set_options", { singleSelect: state });
        });
        $("#is_deselectable").bind("click", function (e) {
            e.preventDefault();
            var state = !$usamap.mapster('get_options').isDeselectable;
            $('#is_deselectable_state').text(state ? "enabled" : "disabled");
            $usamap.mapster("set_options", { isDeselectable: state });
        });

【问题讨论】：

将选择器传递给方法。
我现在不知道怎么做，你可以给我一个例子
改用类名。
Diodeus 对不起，但我现在不知道。你能给我举个例子吗？

标签： javascript jquery map

【解决方案1】：

您可以将地图对象传递给您的bindlinks。我所做的假设是您有多个地图但只有一个控件，并且您希望每次都将控件应用于不同的地图。

function bindlinks(map) {
    // This is really bad..., affecting all links on the page
    // You should only unbind handlers you bound      
    $('*').unbind();

    $("#unbind_link").bind("click", function (e) {
        e.preventDefault();
        map.mapster("unbind");
        map.width(720);
        bindlinks();
    });
    $("#rebind_link").bind("click", function (e) {
        e.preventDefault();
        map.mapster(default_options);
    });

    $("#unbind_link_preserve").bind("click", function (e) {
        e.preventDefault();
        map.mapster("unbind", true);
        bindlinks();
    });
    $("#tooltip").bind("click", function (e) {
        e.preventDefault();
        var state = !map.mapster('get_options').showToolTip;
        $('#tooltip_state').text(state ? "enabled" : "disabled");
        map.mapster("set_options", { showToolTip: state });
    });
    $("#single_select").bind("click", function (e) {
        e.preventDefault();
        var state = !map.mapster('get_options').singleSelect;
        $('#single_select_state').text(state ? "enabled" : "disabled");
        map.mapster("set_options", { singleSelect: state });
    });
    $("#is_deselectable").bind("click", function (e) {
        e.preventDefault();
        var state = !map.mapster('get_options').isDeselectable;
        $('#is_deselectable_state').text(state ? "enabled" : "disabled");
        map.mapster("set_options", { isDeselectable: state });
    });
}

// Call it like
bindlinks( $('#map_id') );

// And later 
bindlinks( $('#map_other_id') )

【讨论】：