在JQuery中创建HTML对象后触发事件

时间:2014-10-22 08:56:14

标签: javascript jquery html

我希望在创建相应的HTML对象(我的情况下为href)后触发事件。

我已经写了这段代码:

$(document).ready(function() {
    $('body').on('click', '#stats-link', function(e) {
        console.log('TRIGGERED'); // nothing is logged
        e.preventDefault();
        $.post('stats.php', {'email': $('#email').val()}, function() {
            window.location = $(this).attr('href');
        });
    });

    $('#submit_button').click(function(e) {
        e.preventDefault();
        ...
        $('#info').html('<p class="desc"><a href="stats.php" id="stats-link">bla bla bla</a></p>');
        ...
    });
});

所以,我在href函数中创建了stats-link标识的#submit_button对象,然后我想让他在相应的函数中触发(即$('body').on(...),但它并没有发生。我做错了什么?

3 个答案:

答案 0 :(得分:2)

你错过了这一行:

$('#stats-link').trigger('click');

这将触发click事件。您共享的代码仅绑定事件。你需要触发它。

JS:

$(document).ready(function () {
    $('body').on('click', '#stats-link', function (e) {
        e.preventDefault();
        alert('clicked')
        $.post('stats.php', {
            'email': $('#email').val()
        }, function () {
            window.location = $(this).attr('href');
        });
    });

    $('#submit_button').click(function (e) {
        e.preventDefault();
        $('#info').html('<p class="desc"><a href="stats.php" id="stats-link">bla bla bla</a></p>');
        $('#stats-link').trigger('click'); //This is where you trigger the click.
    });
});

工作演示:http://jsfiddle.net/lotusgodkk/artaq4xj/

答案 1 :(得分:1)

什么是e?你确定点击事件实际上没有工作,但只是给你一个脚本错误并在它做任何事情之前拯救了吗?您的回调函数未定义传入的event参数e

$('body').on('click', '#stats-link', function() { // <-- No e parameter supplied.
        e.preventDefault();  // <---- What is e?
        ...
}

答案 2 :(得分:1)

缺少您的preventDefault()参数:

$('body').on('click', '#stats-link', function(event) {
    event.preventDefault();
    $.post('stats.php', {'email': $('#email').val()}, function() {
        window.location = $(this).attr('href');
    });
});