javascript - 创建jquery函数以从另一个函数内部创建的html运行

我正在尝试在此函数中利用jquery blur，但是无论我将代码放在哪里，都不会被拾取。

首先，这是我的原始功能。我正在使用sweetalert为用户创建一个漂亮的查找弹出框来编辑记录：

function editLine(data) {

    cost = data.dataset.quotecost;
    resale = data.dataset.quoteresale;
    lineID = data.dataset.lineid;

    swal({
        title: 'Edit Record',
        html:
            '<table id="expand" cellpadding="5" cellspacing="0" border="0" style="margin: 0 auto;">'+
                '<tr>'+
                    '<td class="popupDropHeader">Cost</td>'+
                    '<td class="dropInfo"><input class="editInput" type="text" id="cost" value="'+cost+'"></input></td>'+
                    '<td class="popupDropHeader">Resale</td>'+
                    '<td class="dropInfo"><input class="editInput" type="text" id="resale" value="'+resale+'"></input></td>'+
                '</tr>'+
            '</table>',
        showCancelButton: true,
        confirmButtonText: 'Submit Changes',
        width: 1000,
        closeOnConfirm: false
    },
    function() {

        var inputCost    = $('#cost').val();
        var inputResale  = $('#resale').val();

        swal.disableButtons();

        if(typeof lineID !== 'undefined') {
            $.ajax({
                type: 'POST',
                url: 'editRecord.php',
                data: { inputCost:inputCost, inputResale:inputResale, lineID:lineID},
                success:function(data){
                    setTimeout(function() {
                        swal('Data Updated!');
                    }, 1000);
                }
            }); //close ajax
        };
    }); //close sub-function
}

但是，当我的费用字段模糊时，我想做些事情：

$('#cost').blur(function(){
    //code here...
});

但是我不知道在我的代码中将其放在何处才能起作用。

创建此<td class="dropInfo"><input class="editInput" type="text" id="cost" value="'+cost+'"></input></td>的html与另一个javascript函数绑定的事实是为什么我的解决方案都无法正常工作的原因吗？我尝试将$('#cost').blur函数放在我能想到的任何地方，例如在editLine函数本身内部，

function editLine(data) {

    $('#quoteExpDate').blur(function() {
        console.log("hey it worked!");
        //code here...
    });

    //other code that's pasted above...
}

以及$(document).ready(function(){

以及<script>部分的结尾和开头，但console.log从不触发。我该如何工作？

最佳答案

您有2个选择。


您可以使用内联事件处理程序。

<input class="editInput" type="text" id="cost" value="cost" onblur="costBlurFunction();">

jQuery对事件处理程序使用“ on”。

$('body').on('blur','#cost',function(){
    //code here...
});

关于javascript - 创建jquery函数以从另一个函数内部创建的html运行，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/31864598/