Javascript jquery以编程方式单击新的dom元素

我试图在jquery中做一些棘手的事情（至少对我来说是这样）。我有一个复选框，它绑定到一个名为add_course的函数，如下所示：

    function add_course(){
        var id = $(this).attr('id');
        if ($(this).is(':checked')){

            if($('#courseInput').val().search(id) < 0){
                $('#CourseSummary').append('<span id="cn'+id+'"><a href="#" class="courseDel" id="'+id+'">X</a> '+$('#course'+id+' a').html()+'<br/></span>');
                $('#courseInput').val(function(index,value){
                    return value+ id +',1;';
                });
                addTotal($('#price'+id).text());
            }
            imageSync();
        }else{
            //This is where my question refers to. 
            $('a#'+id+'.courseDel').click();
        }
    }

Delu课程做了很多事情，就像Addu课程一样

正如您在add_课程函数中所看到的那样。我检查复选框是否已被选中，并且仅在复选框已被选中时执行操作

这是德鲁课程：

     function del_course(){
        var id = $(this).attr('id');
        $('#cn'+id).remove();
        $('#courseInput').val(function(index,value){
            return value.replace(id+',1;',"");
        });
        subtractTotal($('#price'+id).text());
        imageSync();
    }

我想让add_课程函数的else部分为选中复选框时添加的相应链接触发del_课程。这不管用。我可能把事情复杂化了

以下是复选框的html（其中一个示例）：

以下是当有人单击复选框时添加的链接的html：

<span id="cn204"><a href="#" class="courseDel" id="204">X</a> Course Title<br/></span>

课程名称

当有人点击链接时效果很好，但是我如何通过编程触发它呢？

使用jquery的函数

$('.courseDel').trigger('click');

---

由于您拥有所创建元素的ID，只需参考ID并使用以下方法：

此外，仅为数字的ID不正确：

ID和名称标记必须以字母（[a-Za-z]）开头，并且可以是 后跟任意数量的字母、数字（[0-9]）、连字符（“-”）， 下划线（“”）、冒号（“：”）和句点（“.”）

---

从长远来看，它可能有助于重新组织代码，以便将DOM事件处理与应用程序逻辑分离

//Functions to add and remove stuff (these are *not* event handlers)
//Since they now receive explicit parameters
// you have full power over when to add and remove stuff and functions
// can very easily call eachother if needed.

//You can have any kind of state you might need, without having to 
//trick the dom into storing it for you:
var currentlySelectedCourse = null;

function add_course(id){
    //its now easy to access global state like the 
    //currently open course
    //and it is now easy to call other functions like del_course
}

function del_course(id){
}

//event handling can now become just a simple layer...

$('.courseDel').live('click', function(){
     var id = //get the id or what parameters you need
     del_course(id); //pass it to the backend function
}); 

---

这将触发类为

courseDel

的所有锚的点击事件。我相信OP想要触发刚刚添加的锚的点击事件。这里需要注意的两项：首先，

id

应该是唯一的，不像您所拥有的那样共享，而且

id和NAME标记必须以字母（[a-Za-z]）开头，后面可以跟任意数量的字母、数字（[0-9]）、连字符（“-”、下划线（“）、冒号(“：”）和句号（“.”）。

另外，在重读问题后，我不确定我是否理解-您在这一行遇到的问题是什么：//这就是我的问题所指的地方。$（'a#'+id+'.courseDel'）。单击（）；更不用说他有多个ID值相同的元素问题在于我的命名约定。

$('.courseDel').trigger('click');

$('#'+id).trigger('click');

//Functions to add and remove stuff (these are *not* event handlers)
//Since they now receive explicit parameters
// you have full power over when to add and remove stuff and functions
// can very easily call eachother if needed.

//You can have any kind of state you might need, without having to 
//trick the dom into storing it for you:
var currentlySelectedCourse = null;

function add_course(id){
    //its now easy to access global state like the 
    //currently open course
    //and it is now easy to call other functions like del_course
}

function del_course(id){
}

//event handling can now become just a simple layer...

$('.courseDel').live('click', function(){
     var id = //get the id or what parameters you need
     del_course(id); //pass it to the backend function
});