毕设记录--jq动态生成html跟绑定事件

最新推荐文章于 2021-06-15 13:07:51 发布

原创最新推荐文章于 2021-06-15 13:07:51 发布 · 237 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery

这篇博客记录了作者在毕设中使用jQuery通过AJAX获取数据库数据，并动态生成HTML选择题。针对动态生成的单选框无法直接绑定事件的问题，作者介绍了使用`$(document).on()`方法进行事件绑定的解决办法，详细解释了如何在静态页面上为动态元素添加点击事件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

因为毕设中要做一个选择题的功能，题目数据均来自数据库，我便想采用ajax来进行数据的响应。这便要求要根据查询到的选项来生成单选框同时采用动态生成的单选框需要绑定事件才能触发点击事件，对我来说是一个新的知识点，记录一下
对于如何在指定div中添加html：
先给div取一个id
使用$("#id").prepend（html内容）的方式添加，该方法在标签内部添加内容

<div class="radio" id="choose" >
</div>
var chooos1="<div><label for='itemA'><input id='itemA' value='A' type='radio' name='radioO'class='item'><text id='text1'></text></label></div>";
$("#choose").prepend(chooos1);//在指定div内添加单选框

下面是添加后浏览器中看到的样子
在这里插入图片描述
对于在jq实现动态添加html这里这篇文章有详细介绍
https://www.cnblogs.com/wanghuih/p/5755932.html

由于动态生成的单选框不能使用
$KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲id" ).click(fun\dots$ (document).on()去绑定事件就能触发了
$("#静态页面存在的id").on(“事件”,".类",function(){})

 $("#choose").on("click",".item",function(){})

对于$("#id" ).click(function () {}）给动态生成的元素绑定事件这篇文章有详细讲解：https://www.feiniaomy.com/post/174.html