Javascript 使用onclick将一个内容替换为另一个内容

我正在使用其中一个引导代码片段，因为在登录框中有一个链接，用于

加入我们

我希望当我单击加入我们时，框中的内容应该被另一个包含登录凭据的框替换

我修改了以下代码

New here ? <a href="#"><b>Join Us</b></a>

现在，当我点击“加入我们”链接时，页面的url会发生变化，即在url末尾注册，但内容不会显示出来， 谁能告诉我怎么做

请检查是否包含jquery

使用

返回false

如下

登录dp
注册dp

请检查是否包含jquery

使用

返回false

如下

登录dp
注册dp

非常简单，您的代码只对我有效

<a href="#" onClick="$('#login-dp').hide(); $('#signup-dp').show()">    
    <b>Join Us</b>
</a>
<a href="#" onClick="$('#login-dp').show(); $('#signup-dp').hide()">
    <b>Login</b>
</a>
<ul id="signup-dp" class="dropdown-menu">
    // signup data Inside this part
</ul>
<ul id="login-dp" class="dropdown-menu">
    // login data Inside this part
</ul>

//注册此部件内的数据


//此部分中的登录数据

---

请点击这个链接

非常简单，您的代码只对我有用

<a href="#" onClick="$('#login-dp').hide(); $('#signup-dp').show()">    
    <b>Join Us</b>
</a>
<a href="#" onClick="$('#login-dp').show(); $('#signup-dp').hide()">
    <b>Login</b>
</a>
<ul id="signup-dp" class="dropdown-menu">
    // signup data Inside this part
</ul>
<ul id="login-dp" class="dropdown-menu">
    // login data Inside this part
</ul>

//注册此部件内的数据


//此部分中的登录数据

---

请点击这个链接

您的代码是正确的。但请检查是否包含jquery文件

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

这个jquery应该包含在您编写的jquery代码之前

将下面的jquery代码放入初始隐藏的signup div中

<script type="text/javascript">
    $(document).ready(function(){
        $("#signup-dp").hide();
    }); 
</script>

$（文档）.ready（函数（）{
$（“#注册dp”）.hide（）；
}); 

您的代码是正确的。但请检查是否包含jquery文件

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

这个jquery应该包含在您编写的jquery代码之前

将下面的jquery代码放入初始隐藏的signup div中

<script type="text/javascript">
    $(document).ready(function(){
        $("#signup-dp").hide();
    }); 
</script>

$（文档）.ready（函数（）{
$（“#注册dp”）.hide（）；
}); 

Onclick jQuery不工作，因此用户Javascript代码

New here ? <a href="#" onclick='document.getElementById("login-dp").style.display = "none";document.getElementById("signup-dp").style.display = "visible";'><b>Join Us</b></a>

这里是新的吗？

Onclick jQuery不工作，因此用户Javascript代码

New here ? <a href="#" onclick='document.getElementById("login-dp").style.display = "none";document.getElementById("signup-dp").style.display = "visible";'><b>Join Us</b></a>

这里是新的吗？

将新的隐藏元素放在现有元素之前的某个位置。

---

除非您在

$（document）.ready（）中编写jQuery代码在单独的文件中，或内部。
将新的隐藏元素放在现有元素之前的某个位置。
除非您在
$（document）.ready（）中编写jQuery代码在单独的文件中，或内部。
首先，为了养成良好的编程习惯，您必须绑定click事件，而不是在tag onClick属性中编写javascript代码

<a href="#" id="btn_join_us"><b>Join Us</b></a>

这类代码可以进行一些安全的事件绑定。否则，任何人都可以从inspect元素更改代码并执行此操作。
首先，为了养成良好的编程习惯，您必须绑定click事件，而不是在tag onClick属性中编写javascript代码

<a href="#" id="btn_join_us"><b>Join Us</b></a>

这类代码可以进行一些安全的事件绑定。否则，任何人都可以从inspect元素更改您的代码并执行此操作。
感谢您提供的有关安全性的提示，我们一定会记住这一点。感谢您提供的有关安全性的提示，我们一定会记住这一点