Javascript在第二次单击后执行

对于这个问题，我既没有找到直接的答案，也没有找到普遍的答案，但我相信，一劳永逸地解决这个问题可能会引起普遍的兴趣。我必须承认我对js很陌生

我的问题是，我需要点击两次“链接”来执行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>

功能切换（navi）{
var elem=document.getElementById（navi）；
如果（elem.style.top==“-604px”）{
elem.style.top=“0px”；//elem.style.textdepro饰=“下划线”；
}否则{
elem.style.top=“-604px”//elem.style.textdepro饰=“无”；
}}

身体

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

更好理解的小提琴：

---

也许您可以帮我解决问题。

您可能希望使用jQuery执行此操作，然后只需单击一次：

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

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

链接
$（“#clicketyclick”）。单击（函数（）{
切换（navi）；
});

如果你是JS新手，你应该学习jQuery，因为它是最好的javascript框架之一，它会让你的生活变得更加轻松

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

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

链接

您可以按照Max Langarek所说的去做，也可以只单击按钮而不是标签

也许像

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

按钮

---

无论哪种方式，我以前都没有见过调用函数的

javascript:toggle（navi）

方式。。也许我需要更多的经验。

试试计算你的点击次数

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>

链接

首先，您没有将字符串传递到“toggle”函数中，以便它根据其id选择元素

然后，使用JQuery获取CSS“top”属性似乎可以解决初始化时“elem.style.top”为空的问题（需要双击）

这是工作小提琴：

---

在调试问题时，console.log非常有用。

jQuery版本和仅js版本似乎都不起作用。我觉得这与在DOM准备就绪时执行脚本有关，而不是使用eventhandler来执行脚本有关。是否包含jQuery并设置链接的id？否则，您可以创建一个fiddle吗？我希望我在这里正确地实现了它，但仍然不起作用：我明白了，像您在示例中那样创建toggle（navi）函数，并使用jQuery调用它，可以使用

$（“#clicketyclick”）。单击（function（）{toggle（navi）；}）

然后在其他地方使用切换函数：

函数切换（navi）{/*函数*/}

可以解决您的问题。嗯，我按照您所说的更新了它，但它似乎仍然不起作用。当然，这是一个初学者的错误，我看不出来。toggle调用是一个直接链接调用。不在那里放置链接（http://blabla），而是在同一页面上放置调用javascript的javascript调用（javascript:）。虽然不经常使用，但它是调用函数的一种可行方法。我想我还没有见过它。。。也许我应该试试。。虽然我还没有看到它有很多好的用途，但是它非常好用，谢谢！此外，console.log是一个很好的技巧，以前从未听说过。

$("#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";
    }
}