创建jquery函数以从另一个函数中创建的html运行

时间:2015-08-06 19:52:37

标签: javascript jquery

我尝试在此功能中使用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永远不会触发。我该如何工作?

1 个答案:

答案 0 :(得分:2)

你有2个选择。

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

    <input class="editInput" type="text" id="cost" value="cost" onblur="costBlurFunction();">
    
  2. jQuery正在使用&#34; on&#34;对于事件处理程序。

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