在jQuery中的javascript切換不按預期工作

我有一個按鈕，使用JavaScript來打開和關閉iframe。在jQuery中的javascript切換不按預期工作

但是，當我點擊按鈕，而不是隻是iframe消失，按鈕也隨着iframe消失。

在檢查螢幕控制檯時，按鈕的CSS也會將顯示參數更改爲'無'。

$(document).ready(function(){ 

    var iDiv = document.createElement('div'); 
    iDiv.id = 'enigma'; 
    iDiv.setAttribute("style", "font-size:18px;position:fixed;bottom:20px;right:5px;display:inline"); 
    document.body.appendChild(iDiv); 

    var div = document.createElement("div"); 
    div.innerHTML = '<iframe src="http://example.com/index.html" width="400" height="200" style="border:0"></iframe>'; 
    iDiv.appendChild(div); 

    var div2 = document.createElement("div"); 
    div2.setAttribute("style","display:inline;"); 
    div2.innerHTML = '<button id="button2">Show/Hide</button>'; 
    document.body.appendChild(div2); 

    setTimeout(function() { 
     $("#button2").css({"position": "fixed", "display": "inline", "bottom": "0", "right": "0"}).click(function(){ 
      $("div").toggle('show'); 
     }); 
    }, 100); 
});

來源

2016-12-11 hnvasa

那麼當你點擊按鈕時，包括那個按鈕在內，你切換所有'div'。 – Iluvatar

您正在切換每個「div」。你的按鈕是'div'嗎？請包括標記。 – Carcigenicate

啊......我的壞...我得到了我做錯了什麼。我如何最好地改變這隻切換iframe？我應該添加iframe ID嗎？ – hnvasa

$("div").toggle('show');切換所有<div>元素。

也許你想

$("iframe").toggle('slow');

或者更具體並添加id你正在試圖控制按Iluvatar's answer

來源

2016-12-11 22:35:03 Moob

''show''對於'toggle（）'無效的參數' – charlietfl

嗯，也許它們表示'慢'？ – Iluvatar

@charlietfl好抓。 – Moob

您需要更具體的這裏的元素...

$("div").toggle();

您目前正針對每個div標記。

來源

2016-12-11 22:35:32

當你點擊按鈕，運行

$("div").toggle('show');

來回切換所有div S的頁面。這包括包含按鈕的那個。你可以添加一個id到你想要隱藏的div來使它工作：

var div = document.createElement("div"); 
div.id = "to-toggle"; 
... 
setTimeout(function() { 
    $("#button2").css({"position": "fixed", "display": "inline", "bottom": "0", "right": "0"}).click(function(){ 
     $("#to-toggle").toggle('show'); 
    }); 
}, 100);

來源

2016-12-11 22:36:32 Iluvatar

在jQuery中的javascript切換不按預期工作

回答

相關問題