將javascript變量傳遞給javascript函數？

Question

我有一個映射應用程序，該應用程序在菜單中列出了不同的地圖圖層，每個圖層都有一個特定的類名。

當用戶單擊名稱時使用該類名稱，以便可以將圖層添加到地圖中或從地圖中刪除，也可以將圖層添加到地圖鍵中/從地圖鍵中刪除。

可以，但是我在每個圖層名稱旁邊都包含一個小叉，以便用戶可以將其從地圖鍵中刪除。

我的代碼如下-我嘗試包括一個onclick函數，該函數帶有圖層ID並嘗試在函數中使用它，但出現錯誤：

未捕獲的錯誤：語法錯誤，無法識別的表達式：.icon [object Object]

由於我的變量現在是一個對象，我需要以其他方式指定lid嗎？

此處的html顯示了使用類ID的圖層的列表選項：

<li class='last layerlist' id='layer63'><a href='#'><i class="fa fa-circle fa-lg iconlayer63"></i><span> Flood Zone 2</span></a></li>

下面的Javascript顯示了當用戶單擊列表時，它會獲取ID，然后使用該ID獲取圖層名稱（與ID相同）來隱藏或顯示圖層，具體取決於是否可見：

//Change layer visibility and add / remove from map key
$(".layerlist").click(function() {
    var lid = $(this).attr('id');
    map.getLayers().forEach(function(layer) {
        if (layer.get('name') == lid) {
            var visibility = layer.getVisible();
            if (visibility == false) {
                layer.setVisible(true);
                $(".icon" + lid).removeClass("fa-circle").addClass("fa-check-circle");
                $("#map-content").append("<p id='" + lid + "key'><a href='#'><i class='fa fa-times-circle' onclick='removeLayer(" + lid + ");'></i></a><img src='img/legend/" + lid + ".png' alt='Layer image'/> " + layer.get('label') + "</p>");
            }
            if (visibility == true) {
                layer.setVisible(false);
                $(".icon" + lid).removeClass("fa-check-circle").addClass("fa-circle");
                $("#" + lid + "key").remove();
            }
        }
    });
});

//Remove selected layer from map key
function removeLayer(lid) {
    lid.setVisible(false);
    $(".icon" + lid).removeClass("fa-check-circle").addClass("fa-circle");
    $("#" + lid + "key").remove();
}

Answer 1

問題出在您的onclick屬性中：

"... onclick='removeLayer(" + lid + ");' ..."

如果lid為"foo" ，瀏覽器將看到的內容為：

... onclick='removeLayer(foo);' ...

請注意，這意味着將調用removeLayer並期望使用名為foo的變量，而不是字符串 "foo" 。

瀏覽器為所有具有id元素創建全局變量； 全局是指元素對象。 因此， foo將引用元素，而不是其id 。

您想要引號：

"... onclick='removeLayer(\"" + lid + "\");' ..."

所以瀏覽器會看到

... onclick='removeLayer("foo");' ...

話雖如此， removeLayer一部分似乎期望有一個對象：

lid.setVisible(false);

您必須告訴我們更多相關信息，以便我們能夠全面幫助您。

---

但是 ，而不是通過添加引號來修復它，我將完全停止使用onxyz屬性。 而是使用現代事件處理。

刪除onclick屬性，而是：

$(document.body).on("click", "selector-for-all-lids", function() {
    // We need to know more to help with this line: lid.setVisible(false);
    var lid = this.id;
    $(".icon" + lid).removeClass("fa-check-circle").addClass("fa-circle");
    $("#" + lid + "key").remove();
});

Answer 2

$(".icon" + lid)

如果您是一個對象，它將被轉換為“ .icon [對象對象]”

是的，您必須更改此設置。 只需檢查此行返回的內容並更改您的代碼即可：

 var lid = $(this).attr('id');

Answer 3

如果“ lid”是一個對象，那么您將無法編寫類似$(".icon" + lid) 。 相反，您應該使用類似$(".icon" + lid.paramName)