Question

一切正常（至少在表面上），但我担心我的jquery代码有多干净和简单。例如，我打开并关闭了我的脚本三次，并在任何地方调用相同的函数。我确定这有点多余，但我现在不知道如何简化。对不起，我有点像个ro客。我将不胜感激任何帮助。

jQuery(document).bind('gform_post_render', function(){
    jQuery("#input_3_4").keyup(function() {
        jQuery("#previewtxt1a").html(jQuery(this).val())
    })
});

jQuery(document).bind('gform_post_render', function(){
    jQuery("#input_3_5").keyup(function() {
        jQuery("#previewtxt2a").html(jQuery(this).val())
    })
});

jQuery(document).bind('gform_post_render', function(){ 
    jQuery("#input_3_6").keyup(function() {
        jQuery("#previewtxt3a").html(jQuery(this).val())
    })
});

Answer 1

您绝对可以将公共代码重构为函数：

function set(el) {
  jQuery("#previewtxt2a").html(jQuery(el).val())
  });
}

您也不需要拆分多个脚本块，事实上，您的代码可能更简单：

jQuery(document).bind('gform_post_render', function(){
    [
        {src: '#input_3_4', target: '#previewtxt1a'}, 
        {src: '#input_3_5', target: '#previewtxt2a'}, 
        {src: '#input_3_6', target: '#previewtxt3a'}
    ].forEach(function(item) {
        jQuery(item.src).keyup(function() {
            jQuery(item.target).html(this.val());
        });
    });

作为旁注，我不确定为什么人们会把这个问题投下来 - 这是一个关于从想要学习的人那里重构的问题。

Answer 2

以下是代码的更简洁版本，

<script type="text/javascript">

jQuery(document).ready(function () {

$("#input_3_4").keyup(function () {
    jQuery("#previewtxt1a").html($(this).val())
});

$("#input_3_5").keyup(function () {
    $("#previewtxt2a").html($(this).val())
});


$("#input_3_6").keyup(function () {
    $("#previewtxt3a").html($(this).val())
});

});

</script>

清理我的jquery

2 个答案: