如何在js中调用append里面点击标签变化的函数

本文介绍如何在JavaScript中处理动态添加元素后的点击事件,特别是在使用append方法追加HTML内容后,确保新添加的li标签能响应点击并触发相应变化。
摘要由CSDN通过智能技术生成

在html中可以直接点击标签li,在<script></script>加入如下代码

$(".dev_topcoli").click(function(){
  if($(this).find("img").attr('src')=='images/light_a.png'){
  $(this).find("img").attr('src',"images/light_b.png");
  }
  else{
   $(this).find("img").attr('src',"images/light_a.png");
  };
  
	  //   $(this).find("img").attr('src',$(this).attr('src')=='images/light_a.png'?'images/light_b.png':'images/light_a.png':"");
	}

而在js中append中追加后达不到这样的效果,在js中增加如下代码:

$(".dev_topcoli").live("click", function() {
	if ($(this).find("img").attr('src') == 'images/light_b.png') {
		$(this).find("img").attr('src', "images/light_a.png");
		
	} else {
		$(this).find("img").attr('src', "images/light_b.png");
	
	}
});


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在 HTML 调用 Python 函数有多种方式,以下是其一种: 1. 在服务器端使用 Python 编写 Web 应用程序,例如使用 Flask 框架。 2. 在 HTML 使用 JavaScript 调用 Python 函数,可以使用像 Skulpt 这样的 Python 解释器。Skulpt 是一个在浏览器运行的 Python 解释器,它允许您在客户端执行 Python 代码。 以下是一个使用 Skulpt 在 HTML 调用 Python 函数的示例代码: ```html <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> <script src="https://skulpt.org/static/skulpt.min.js" type="text/javascript"></script> <script src="https://skulpt.org/static/skulpt-stdlib.js" type="text/javascript"></script> <script type="text/javascript"> // 定义 Python 函数 function add(a, b) { return a + b; } // 在页面加载完成后执行 $(document).ready(function() { // 初始化 Skulpt Sk.configure({output: function(text) { $("#output").append(text + "\n"); }}); // 执行 Python 函数 Sk.misceval.callsimAsync("add", Sk.ffi.remapToPy(2), Sk.ffi.remapToPy(3)).then(function(result) { $("#output").append(Sk.ffi.remapToJs(result) + "\n"); }); }); </script> </head> <body> <div id="output"></div> </body> </html> ``` 这个例子定义了一个名为 `add` 的 Python 函数,在页面加载完成后使用 Skulpt 执行了这个函数,并将结果输出到页面上。注意,Skulpt 需要加载两个 JavaScript 文件才能正常工作,因此这两个文件也被包含在 HTML
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值