首页 \ 问答 \ 点击事件不会触发新创建的li标签(click event does not fire on newly created li tags)

点击事件不会触发新创建的li标签(click event does not fire on newly created li tags)

使用以下代码:

<!DOCTYPE html>
<html>
<head>
<title>test list</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
</head>
<style>
li{
display:inline;
}
</style>
<body>
<input type="hidden" value="4" id="value">

<ol></ol>

<button id="btn2">increase</button>
<button id="btn1">show</button>
<p></p>
</body>
<script>
$("li").click(function(){
    $(this).nextAll().css({"color":"red"});;
});

$("#btn2").click(function(){
    var text="<li> -> kkk</li>"; 
    $("ol").append(text);
});

$("#btn1").click(function(){
    $("p").text($("li").length);
});
</script>
</html>

点击“增加”按钮后出现的任何新创建的“li”标签都不会触发绑定到点击事件的处理程序。

$("li").click(function(){
    $(this).nextAll().css({"color":"red"});;
});

你能告诉我为什么它不起作用吗? 是否有可能使其工作? 如果是,如何? 非常感谢你。


With the following code:

<!DOCTYPE html>
<html>
<head>
<title>test list</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
</head>
<style>
li{
display:inline;
}
</style>
<body>
<input type="hidden" value="4" id="value">

<ol></ol>

<button id="btn2">increase</button>
<button id="btn1">show</button>
<p></p>
</body>
<script>
$("li").click(function(){
    $(this).nextAll().css({"color":"red"});;
});

$("#btn2").click(function(){
    var text="<li> -> kkk</li>"; 
    $("ol").append(text);
});

$("#btn1").click(function(){
    $("p").text($("li").length);
});
</script>
</html>

any newly created "li" tags that appear after clicking "increase" button, do not trigger handlers bound to the click event.

$("li").click(function(){
    $(this).nextAll().css({"color":"red"});;
});

Can you please tell me the reason why it's not work. And is it possible to make it work? If yes, How? Thank you very much.


原文:https://stackoverflow.com/questions/20087738
更新时间:2019-11-12 20:23

最满意答案

编写一个自定义路由类,用于路由到该控制器。

有关如何执行此操作 ,请参阅手册的路由章节

在您的路由中,您将实现检查您期望的实际控制器文件是否存在的逻辑,并定义回调。 您也可以使用路由选项数组来定义回调,这将使其更具可重用性。


Write a custom route class that you'll use for the route to that controller(s).

See the routing chapter of the manual for how to do that.

Inside your route you'll implement the logic that checks if the actual controller file you expect is present or not and define a callback. You can use the route options array to define a call back as well, this would make it more re-useable.

相关问答

更多
  • 编写一个自定义路由类,用于路由到该控制器。 有关如何执行此操作 ,请参阅手册的路由章节 。 在您的路由中,您将实现检查您期望的实际控制器文件是否存在的逻辑,并定义回调。 您也可以使用路由选项数组来定义回调,这将使其更具可重用性。 Write a custom route class that you'll use for the route to that controller(s). See the routing chapter of the manual for how to do that. Ins ...
  • 它似乎从app -> model -> exampleModel.php vs Plugin -> Admin -> Model -> exampleModel.php ,你在这两个目录中有两个相同的类,但是不支持,我担心: 由于PHP在旧版本中缺少命名空间,因此您的插件中不能使用相同的类或相同的文件名。 即使它是两个不同的插件。 因此,使用唯一的类和文件名,可以使用插件名称为类和文件名添加前缀。 来源: http : //book.cakephp.org/2.0/en/plugins/how-to-cre ...
  • 您需要在$routes->connect提及您的插件名称 Router::scope('/myFirstPlugin/index', function (RouteBuilder $routes){ $routes->connect('/', ['plugin' => 'myFirstPlugin','controller' => 'test', 'action' => 'index']); }); You need to mention your plugin name within $r ...
  • 不,你不能像在视图文件中那样覆盖应用程序中的任何插件类文件。 只需制作插件的副本并修改所需的类文件即可。 No you cannot override any plugin class files in your app like you can do for view files. Just make a copy of the plugin and modify required class files.
  • 您可以尝试使用get_class()来确定它是否真的使用“用户”模型,或者通用的“AppModel”或“模型”; 在你的控制器的动作内; debug(get_class($this->User)); 如果它是'Model'或'AppModel',CakePHP显然无法从插件中找到或加载您的User模型。 还要检查你是否真的在bootstrap.php中加载了插件。 阅读此处的文档: 插件 You may try get_class() to find out if it is really using t ...
  • 为了构建Thorpe Obazee的回答和我的评论,最好的做法是将权限管理作为控制器组件,而不是控制器本身。 如前所述,你真的不应该从控制器调用控制器 - 这违背了MVC的原则(反过来CakePHP)。 一个组件可以被封装在一个插件中。 如果你的插件被称为Permissions ,你的组件也被称为Permissions ,那么你的目录结构如下所示: 应用 插入 权限 调节器 零件 PermissionsComponent.php 当你加载你的插件时,你可以在核心应用程序的控制器中使用这个组件作为任何其他组件 ...
  • 确保插件已加载到您的config / bootstrap.php中 Plugin::load('Elite'); 然后用localhost:8675 / elite / bingo.txt链接到插件的webroot Make sure the plugin is loaded in your config/bootstrap.php Plugin::load('Elite'); Then link to the webroot of the plugin with localhost:8675/elit ...
  • 首先, public $helpers = array('Html'); 不会在控制器中加载帮助程序 ,它会将其加载到控制器呈现的视图文件中 。 您将能够在呈现的视图中使用$ this-> Html引用,而不是任何控制器操作。 这与您是否尝试在插件控制器或普通控制器中加载Helper无关。 检查Cake Docs中的包树,并阅读有关Component和Helper之间差异的更多信息。 您可以在Controller中使用Component ,在View中使用Helper 。 您不应该在控制器中使用HtmlHe ...
  • 你也许可以使用组合而不是继承? 即创建一个“app \ controllers \ users_controller”,其中包含插件控制器的实例。 UsersController通过存根传递任何未修改的操作,例如: class UsersController extends AppController { ... var spark_plug_users_controller; ... public function __construct() { parent: ...
  • 添加'plugin'=>'PLUGIN NAME HERE'

相关文章

更多
  • Christmas Air Jordan 4 thunder and fire red here
  • 在列表li里两个浮动div兼容IE6问题
  • storm事件管理器EventManager源码分析-event.clj
  • the5fire博客对接微信公众平台接口 | the5fire的技术博客
  • Solr参数(DisMax Event Facet)
  • JavaScript 事件
  • JavaScript 事件
  • 创建标签-git入门教程
  • 解决点击没有内容的空白div没有响应click事件的方法
  • [转]Top 20 Programming Lessons I've Learned in 20 Years
  • 最新问答

    更多
  • 您如何使用git diff文件,并将其应用于同一存储库的副本的本地分支?(How do you take a git diff file, and apply it to a local branch that is a copy of the same repository?)
  • 将长浮点值剪切为2个小数点并复制到字符数组(Cut Long Float Value to 2 decimal points and copy to Character Array)
  • OctoberCMS侧边栏不呈现(OctoberCMS Sidebar not rendering)
  • 页面加载后对象是否有资格进行垃圾回收?(Are objects eligible for garbage collection after the page loads?)
  • codeigniter中的语言不能按预期工作(language in codeigniter doesn' t work as expected)
  • 在计算机拍照在哪里进入
  • 使用cin.get()从c ++中的输入流中丢弃不需要的字符(Using cin.get() to discard unwanted characters from the input stream in c++)
  • No for循环将在for循环中运行。(No for loop will run inside for loop. Testing for primes)
  • 单页应用程序:页面重新加载(Single Page Application: page reload)
  • 在循环中选择具有相似模式的列名称(Selecting Column Name With Similar Pattern in a Loop)
  • System.StackOverflow错误(System.StackOverflow error)
  • KnockoutJS未在嵌套模板上应用beforeRemove和afterAdd(KnockoutJS not applying beforeRemove and afterAdd on nested templates)
  • 散列包括方法和/或嵌套属性(Hash include methods and/or nested attributes)
  • android - 如何避免使用Samsung RFS文件系统延迟/冻结?(android - how to avoid lag/freezes with Samsung RFS filesystem?)
  • TensorFlow:基于索引列表创建新张量(TensorFlow: Create a new tensor based on list of indices)
  • 企业安全培训的各项内容
  • 错误:RPC失败;(error: RPC failed; curl transfer closed with outstanding read data remaining)
  • C#类名中允许哪些字符?(What characters are allowed in C# class name?)
  • NumPy:将int64值存储在np.array中并使用dtype float64并将其转换回整数是否安全?(NumPy: Is it safe to store an int64 value in an np.array with dtype float64 and later convert it back to integer?)
  • 注销后如何隐藏导航portlet?(How to hide navigation portlet after logout?)
  • 将多个行和可变行移动到列(moving multiple and variable rows to columns)
  • 提交表单时忽略基础href,而不使用Javascript(ignore base href when submitting form, without using Javascript)
  • 对setOnInfoWindowClickListener的意图(Intent on setOnInfoWindowClickListener)
  • Angular $资源不会改变方法(Angular $resource doesn't change method)
  • 在Angular 5中不是一个函数(is not a function in Angular 5)
  • 如何配置Composite C1以将.m和桌面作为同一站点提供服务(How to configure Composite C1 to serve .m and desktop as the same site)
  • 不适用:悬停在悬停时:在元素之前[复制](Don't apply :hover when hovering on :before element [duplicate])
  • 常见的python rpc和cli接口(Common python rpc and cli interface)
  • Mysql DB单个字段匹配多个其他字段(Mysql DB single field matching to multiple other fields)
  • 产品页面上的Magento Up出售对齐问题(Magento Up sell alignment issue on the products page)