2011-08-09 209 views
0

基本上,輸入[name = sys_title]的值被輸入到[name = g_title]的輸入,輸入[name = g_title]被輸入到[name = headline]的輸入。檢測onchange並觸發事件

我使用keyup()來檢測變化事件,以從'sys_title'填充'g_title',但'標題'輸入不檢測'g_title'中的變化,除非我標籤出g_title輸入。有沒有辦法在'g_title'輸入中檢測到變化時同時填充'標題'?

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://code.jquery.com/jquery-latest.js"></script> 
</head> 
<body> 
<label> sys title</label> 
<input name="sys_title" type="text" size="35" value=""> 
<label>full title </label> 
<input name="g_title" type="text" size="35" value=""/> 
<label>headline</label> 
<input name="headline" type="text" value=""/> 
<script> 
(function($){ 
    $.fn.updateme = function(options) { 
    var defaults = { 
    onlyIfEmpty: false, 
    useDisplay: false, 
    index:-1, 
    delimiter : ":", 
    fieldName: "g_title", 
    }; 

var options = $.extend(defaults, options); 

return this.each(function() { 
    obj = $(this); 



// obj is curren input field get v 
var fieldValue = obj.attr("value"); 
if ((options.onlyIfEmpty == false)|| fieldValue.length==0) { 
className = "updateme-fieldname-"+options.fieldName; 
if (options.useDisplay) { 
    obj.addClass("updateme-display"); 
} 
if (options.index>=0) { 
    obj.addClass("updateme-index-"+options.index); 
} 

    obj.addClass(className); 
    $(':input[name="'+options.fieldName+'"]').keyup(function() { 
     newObj = $(this); 
    // $("."+className).val(newObj.val()).change(); 

     $("."+className).each(function(index) { 
       if ($(this).hasClass("updateme-display")) { 
        var selected = $("option:selected",newObj); 
        var displayValue = selected.text(); 

        if ($("[class^='updateme-index-']")) { 
         index = 1; 
     displayValue = displayValue.split(options.delimiter)[index]; 
        }  
      $(this).val(displayValue);      

       } else { 
        $(this).val(newObj.val()); 

        } 


     }); 
    }).keyup(); 
    } 

}); 
}; 
})(jQuery); 


//register with 

$().ready(function() { 

$("input[name='g_title']").updateme({ 
onlyIfEmpty: true, 
useDisplay: false, 
fieldName: "sys_title" 
}); 

$("input[name='headline']").updateme({ 
onlyIfEmpty: false, 
    useDisplay: false, 
    fieldName: "g_title" 
    }); 


}); 
</script> 

</body> 
</html> 

回答

0

使用change事件,而不是keyup

$(':input[name="'+options.fieldName+'"]').bind('change keyup', function() { 
     newObj = $(this); 

     $(".updateme-fieldname-"+this.name).each(function(index) { 
       if ($(this).hasClass("updateme-display")) { 
        var selected = $("option:selected",newObj); 
        var displayValue = selected.text(); 

        if ($("[class^='updateme-index-']").length) { 
         index = 1; 
     displayValue = displayValue.split(options.delimiter)[index]; 
        }  
      $(this).val(displayValue);      

       } else { 
        $(this).val(newObj.val()); 

        } 


     }); 
    }).trigger('change'); 
+0

喜尚卡爾,如果我輸入的東西到SYS-標題也被同時填入g_title,將「變」事件會做的伎倆對我來說,填充g_title和'標題'? – avinash

+0

請檢查我編輯的答案希望有幫助。 – ShankarSangoli

+0

沒有運氣shankar,把這些變化沒有檢測到任何現在... :( – avinash