Javascript執行後第二次點擊

我還沒有找到這個問題的直接或普遍的答案，但我相信可能會有一個普遍的興趣，一勞永逸地解決它。我必須承認我對js很陌生。Javascript執行後第二次點擊

我的問題是，我需要點擊兩次「鏈接」才能執行javascript。

頭：

<script type="text/javascript"> 
function toggle(navi){ 
var elem = document.getElementById(navi); 

if(elem.style.top == "-604px"){ 
    elem.style.top = "0px"; // elem.style.textDecoration = "underline"; 
}else{ 
    elem.style.top = "-604px";//elem.style.textDecoration = "none"; 
}} 
</script>

體

<a href="javascript:toggle('navi')">Link</a>

一種更好的理解小提琴：fiddle

也許你可以幫我..

來源

2014-04-07 juliusklaus

首先你沒有傳遞字符串到「切換」功能，爲它選擇的元素通過它的ID。

然後使用JQuery獲得CSS'top'屬性似乎解決了在初始化（需要雙擊）時'elem.style.top'爲空的問題。

這裏的工作小提琴：調試問題時http://jsfiddle.net/gkhBM/

$("#clicketyclick").click(function() { toggle("navi"); }); 

function toggle(navi) { 
    var elem = document.getElementById(navi); 
    //console.log(elem.style.top); 
    //console.log($(elem).css('top')); 
    if($(elem).css('top') == "-604px"){ 
     $(elem).css('top',"0px"); // elem.style.textDecoration = "underline"; 
    }else{ 
     $(elem).css('top',"-604px");//elem.style.textDecoration = "none"; 
    } 
}

的console.log是非常有用的。

來源

2014-04-07 16:42:10 Simon

這很好，謝謝！另外console.log是一個很棒的提示，以前沒有聽說過。 – juliusklaus

你可能想這個使用jQuery做，那麼你只需要點擊一次：

<a id='clicketyclick'>Link</a> 

<script> 
    $("#clicketyclick").click(function() { 
     toggle(navi); 
    }); 
</script>

如果您是新的JS，你應該學習jQuery，因爲它是最好的一個JavaScript框架四周，它將讓你的生活變得容易很多。

如果，但是，不想使用jQuery，你基本上可以使用：

<a onclick="toggle(navi)">Link</a>

來源

2014-04-07 14:05:29

jQuery版本和js only版本似乎都不起作用。我覺得這與在DOM準備完成時執行腳本而不是使用事件處理程序來執行操作有關。 – juliusklaus

你包含jQuery並設置鏈接的ID嗎？否則，你可以創建一個小提琴嗎？ –

我希望我在這裏正確實施它，仍然不起作用：[小提琴]（http：// jsfiddle。net/pQKQt/2 /） – juliusklaus

你可以做的最大Langarek說，或者您也可以只點擊，但作爲一個按鈕，而不是一個一個的標籤。

也許像

<button onclick="toggle(navi)">Button</button>

無論哪種方式，我從來沒見過之前調用函數的javascript:toggle(navi)方式..也許我需要更多的經驗。

來源

2014-04-07 14:08:03

javascript：toggle調用是直接鏈接調用。不要在那裏放置鏈接（http：// blablabla），而是將JavaScript調用（javascript :)調用到同一頁面上的javascript。雖然不經常使用，但它是調用函數的可行方法。 –

我想我還沒有遇到它......也許我應該嘗試一下......雖然我沒有看到它的很多好用途。 –

試着數的點擊次數

var clickNumber = 1; 

function functionTwice() { 

    if(clickNumber == 1) { 
     clickNumber = clickNumber +1; 
    } 
    else if(clickNumber == 2) { 
     clickNumber = 1; 
      var elem = document.getElementById(navi); 

    if(elem.style.top == "-604px"){ 
     elem.style.top = "0px"; // elem.style.textDecoration = "underline"; 
    }else{ 
     elem.style.top = "-604px";//elem.style.textDecoration = "none"; 
    } 
    } 


}

HTML：

<a id='clicketyclick' onClick="functionTwice()">Link</a> 
<div id="navi"></div>

來源

2014-04-07 16:19:02

Javascript執行後第二次點擊

回答

相關問題