gpt4 book ai didi

javascript - 在不刷新浏览器的情况下使用 replaceWith 同时单击按钮

转载 作者:行者123 更新时间:2023-11-27 23:28:50 25 4
gpt4 key购买 nike

我想弄清楚如何在不刷新浏览器的情况下同时单击我的按钮。我注意到,如果我单击其中一个按钮,它会起作用并使用 .replaceWith 替换它的新值,但是当我单击另一个按钮时,它不会给我另一个值。

代码:

<body>
<input type = "button" id = "bt1" value = "See my Full Name :)">
<input type = "button" id = "bt2" value = "See my Nickname :)">

<div>
<div class = "name">See my name</div>
</div>

<script>

$(document).ready(function ()
{
$("#bt1").click
(
function ()
{
$("div.name").replaceWith("<div>John Francis</div>");
alert("Your full name is John Francis");
}
);

$("#bt2").click
(
function ()
{
$("div.name").replaceWith("<div>Francis</div>");
alert("Your nickname is Francis");
}
);
});

</script>

最佳答案

您没有将类名 .name 添加到您替换的新插入的 DIV 中,因此下次单击时,没有类 .name 的元素>.

只更新文本会容易得多

$(document).ready(function() {
$("#bt1").click(function() {
$(".name").text("John Francis");
alert("Your full name is John Francis");
});

$("#bt2").click(function() {
$(".name").text("Francis");
alert("Your nickname is Francis");
});
});

FIDDLE

如果出于某种原因你必须使用 replaceWith (你不用),只需添加类

$(document).ready(function() {
$("#bt1").click(function() {
$(".name").replaceWith("<div class='name'>John Francis</div>");
alert("Your full name is John Francis");
});

$("#bt2").click(function() {
$(".name").replaceWith("<div class='name'>Francis</div>");
alert("Your nickname is Francis");
});
});

FIDDLE

关于javascript - 在不刷新浏览器的情况下使用 replaceWith 同时单击按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36999287/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com