gpt4 book ai didi

javascript - 将函数分配给 jQuery 中的单个字母

转载 作者:行者123 更新时间:2023-12-03 11:35:57 25 4
gpt4 key购买 nike

我需要使字母“x”可点击,并添加一个函数来删除下面这一行创建的文本。

$("#user").prepend("<li>Hello! <span id='clickable'>x</span></li>");

$(document).ready(function() {
$("#hello").click(function() {
$("#user").prepend("<li>Hello! <span id='clickable'>x</span></li>");
$("#webpage").prepend("<li>Why hello there!!</li>");
$("#user").children("li").first().click(function(){
$(this).remove();
});
$("#webpage").children("li").first().click(function(){
$(this).remove();
});
});
$("#goodbye").click(function() {
$("#user").prepend("<li>Goodbye!</li>");
$("#webpage").prepend("<li>Goodbye, dear user!</li>");
$("#user").children("li").first().click(function(){
$(this).remove();
});
$("#webpage").children("li").first().click(function(){
$(this).remove();
});

});
$("#stop").click(function() {
$("#user").prepend("<li>Stop copying me!</li>");
$("#webpage").prepend("<li>Sorry, i meant no offense.</li>");
$("#user").children("li").first().click(function(){
$(this).remove();
});
$("#webpage").children("li").first().click(function(){
$(this).remove();
});
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
<link href="CSS/bootstrap.css" rel="stylesheet" type="text/css">
<link href="CSS/styles.css" rel="stylesheet" type="text/css">
<script src="jQuery/jQuery.js"></script>
<script src="talk.js"></script>
<title>Talk to the web page</title>
</head>
<body>
<div class="container">
<h1>Talk to the web page</h1>
<p>Click a button to say something to the web page. See what it says back!</p>

<button class="btn btn-primary" id="hello">Say "hello"</button>
<button class="btn btn-inverse" id="goodbye">Say "goodbye"</button>
<button class="btn btn-danger" id="stop">Say "stop copying me!"</button>

<div class="row">
<div class="col-md-6">
<h2>You said:</h2>
<ul class="unstyled" id="user">

</ul>
</div>

<div class="col-md-6">
<h2>The web page said back:</h2>
<ul class="unstyled" id="webpage">

</ul>
</div>
</div>
</div>
</body>
</html>

一个可点击的字母,用于删除上面这一行创建的文本。

最佳答案

创建使用 .on 的一次点击事件(因为动态内容等等)并删除父 li 元素:

$("#user").on("click", "span.clickable", function() {
$(this).parent("li").remove();
});

还使用类clickable而不是ID(我假设你有超过1个);

关于javascript - 将函数分配给 jQuery 中的单个字母,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26509430/

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