使用jquery截断和添加表单元素

我是jquery的新手，并试图截断表单元素字符串，然后连接或稍后添加它们。使用jquery截断和添加表单元素

jQuery(document).ready(function($){ 
var sur = $('#field_surname').val(); //Get value from field surname and store it in sur 
var name = $('#field_adult_name').val(); //Get value from field adult_name and store it in name 
var pcode = $('#field_postcode').val();// Get value from field postcode and store it in pcode 
var surshort = jQuery.trim(sur).substring(0, 3); //truncate first three letters 
var nameshort = jQuery.trim(name).substring(0, 3);//truncate first three letters 
var pcodeshort = jQuery.trim(pcode).substring(0, 12);//truncate first 12 letters 
var msg = surshort+nameshort+pcodeshort; // Add all the strings 
$("#field_sur").val("SKU"+msg); // write values in field_sur and prefix SKU to it 
});

大多数我所看到的是指做那些提交后或提交或形式验证事件的查询，但我想它，当用户在

所以我也尝试使用数据填充：

jQuery(document).ready(function($){ 
    /*Fire up the script when the below three fields change*/ 
    $('#field_surname', '#field_adult_name','#field_postcode').change(function(){ 
    var sur = $('#field_surname').val(); 
    var name = $('#field_adult_name').val(); 
    var pcode = $('#field_postcode').val(); 
    var surshort = jQuery.trim(sur).substring(0, 3); 
    var nameshort = jQuery.trim(name).substring(0, 3); 
    var pcodeshort = jQuery.trim(pcode).substring(0, 12); 
    var msg = surshort+nameshort+pcodeshort; 
    $('#field_sur').val("SKU"+msg); 
    }); 

});

但几个小时后，我无法在#sur_field中获得所需的值。我使用最新的wordpress与Zia3自定义CSS和JS插件注入JS。请协助。

来源

2016-02-27 Prince

你的代码看起来不错，是你的html正确吗？你的游戏机说什么？ – David

@大卫：控制台是空白的。显然没有价值计算。我不确定我出错的地方。 – Prince

使用控制台日志写入控制台。代码是正确的，但显然我们看不到1.代码是在页面上输出的2.你有正确的html字段等！ – David

感谢David为console.log故障排除提供了启发。

但是，我发现了问题，并在此期间解决了我的问题。

的问题是： $('#field_surname', '#field_adult_name','#field_postcode').change(function(){

和一个具有不声明每个DIV ID，而不是宣布这一切在一个这样的： $('#field_surname, #field_adult_name, #field_postcode').change(function(){

另一种方法是使用单独的功能，并呼吁他们在另一个变量，但它会再次需要使用上面的方法，但是整齐地跟踪三个表单元素的变化：

jQuery(document).ready(function($){ 

    $('#field_surname').change(function(){ 
     var sur = $('#field_surname').val(); 
     var surshort = jQuery.trim(sur).substring(0, 3); 
     $('#field_sur').val("MEM"+surshort); 
    }); 
    $('#field_adult_name').change(function(){        
     var name = $('#field_adult_name').val(); 
     var nameshort = jQuery.trim(name).substring(0, 3); 
     $('#field_shortname').val(nameshort); 
    }); 
    $('#field_postcode').change(function(){ 
     var pcode = $('#field_postcode').val(); 
     var pcodeshort = jQuery.trim(pcode).substring(0, 12); 
     $('#field_shortpcode').val(pcodeshort); 
    }); 
    $('#field_sur, #field_shortname, #field_shortpcode').blur(function(){ 
     var val1 = $("#field_sur").val(); 
     var val2 = $("#field_shortname").val(); 
     var val3 = $("#field_shortpcode").val(); 
     $("#field_msg").val(val1+val2+val3); 
    }); 

});

希望它对像我这样的新手jquery用户有所帮助:)

来源

2016-02-27 22:51:28 Prince

使用jquery截断和添加表单元素

回答

相关问题