Question

我正在用jquery创建一个span。由于该跨度不在初始循环中，因此事件处理程序不起作用。我搜索了解决方案并使我的代码像这样 -

$(".uploaded_file_delete").on("click", function(e){
        e.preventDefault();
        var fileurl = $(this).attr("data-fileurl");
        var data = { fileurl: fileurl, action: 'uploaded_file_delete' };
        var deleteonsuccess = $(this).parent();

        $.ajax({
      url: someaction.ajax_url,
      type: 'POST',
      data: data,
      cache: false,
      dataType: 'json',
      success: function(data, textStatus, jqXHR) {.....

此代码适用于硬编码的跨度，但不适用于动态生成的跨度。我正在使用jQuery 1.12.4。我做错了什么？

Answer 1

您需要使用live而不是on来绑定事件处理程序。

// @flow
import React, { Component } from 'react';
import { Text } from 'react-native';

type PropTypes = {}
export default class SampleVC extends Component<PropTypes> {
    render() {
        return (
            <Text style={{ fontSize: 60 }}>
                Big Text
                <Text style={{ fontSize: 20 }}>Small Text</Text>
            </Text>
        );
    }
}

或者使用较新的jQuery，语法为：

$('body').live('.uploaded_file_delete', function() {
    // Do stuff here...
});

Answer 2

当您使用jQuery 1.4.1时，您可以使用live()功能

描述：为现在和将来与当前选择器匹配的所有元素附加事件处理程序。

这样的事情：

$(".uploaded_file_delete").live( "click", function(e){...} );

请注意，jQuery 1.7上已弃用此功能，因此如果您升级到此版本，则应按照BalázsVarga所说的那样进行操作

Answer 3

使用jQuery 1.12.4，您可以使用较新的.on语法。只需定义父元素（大多数父元素为document或body，但尽可能不同）并添加要添加事件监听器的元素选择器作为第二个参数。

$(document).on( "click", ".uploaded_file_delete", function() {
  // ...
});

事件处理程序不使用fn.on动态生成的span

3 个答案: