jquery按钮置灰不可点击创建的按钮为什么加了点击没有用？

来源：蜘蛛抓取(WebSpider) 时间：2023-12-08 02:17 标签： jquery按钮置灰不可点击
解决jQuery新增元素无法绑定事件的方法
在写html时，我们往往想要通过JavaScript来为页面添加一些事件特效.
例如：我们想在点击某一元素（例如按钮等）来为网页添加新的元素，当你再想在你点击事件新增的元素中在绑定一个事件时往往会出现以下问题。
在写JS代码中我们常常用页面加载事件Window.onload事件来触发事件，但是触发的事件的元素有动态和静态之分。
动态元素写在你所写的触发事件中能够检测到的，而静态元素往往是不能检测到的。列如下图
我在HTML文本中引入了JQuery的js文件在HTML的body中创建两个div，第一个div里我放了一个按钮并且给按钮一个ID是addElement,同时给它一个鼠标点击事件，触发的内容是在我第二个ID是content的div里添加一个ID是pageElement的段落标签p标签。同时在给这个P标签一个鼠标点击事件，效果是移除页面上所有的元素，达到清空页面的功能。理想状态下我们可以点击“添加元素”这个按钮会在按钮下方生成一段文字，然后再点击生成的文字后，页面上所有的元素都会清空，整个网页都是空白运行一下代码当我打开页面时是只有一个按钮，当我点击按钮时会出现一段文字，如下图然而在我点击段落标签后，页面上所有的元素并没有消失，还是一动不动的在网页上。这就是静态元素与动态的元素的区别。那么怎么样才能让元素消失呢？这个问题的问题点是我们新增加的元素不在方法的识别范围之内，我们把代码写在了JQury的read方法中，这个方法的意思是当文档准备就绪，也就是页面上所有的节点(元素)加载完毕时开始执行方法里面的内容。这个问题是ready方法执行完毕了获取到了我们第一个div中的按钮的id并且给它绑定一个点击事件,所以我点击按钮时触发了方法，而P标签是在我们点击按钮时才生成的，此时ready方法运行完毕是发现只是找到了按钮的id，并没有发现p标签的ID，也没有给p标签绑定事件，所以我们点击文字是没有任何的反应的！那么我们怎么解决这个问题呢这个时候我们可以意识到，新增加的元素没有被绑定事件，那么我们给它重新绑定一个事件不就是可以了吗？此时我们的代码可以改成这样我们可以在ready方法外面新建一个方法，在方法里面写一个函数，并且给新增加的函数绑定事件就可以达到理想的效果，让我们看一下实际效果一，打开网页后二，点击按钮后三，点击文字后通过给元素重新绑定事件，就可以给通过页面加载后新创建的元素来绑定事件这是个简单的逻辑关系，也是我之前犯错的地方。希望对你有所帮助，喜欢本文章的可以点个赞，或者可以留下你宝贵的意见与评论。感谢你的阅读！
dom节点
name
我们这么写发现点击事件没有用