如何组合两个相似的脚本,并在略有变化的情况下运行它

How to combine two similar scripts and run it with slight variations

本文关键字:有变化 情况下 运行 相似 组合 何组合 两个 脚本      更新时间:2023-09-26

我有以下两个脚本:第一个程序从输入#search中获取关键字,并用ajax调用该关键字的结果填充下拉框#search-results。

$(document.body).on( 'keyup', '#search', function ( e ) {
//e.preventDefault();
value = $(this).val(); //grab value of input text
  jQuery.ajax({
    url : ajaxsearch.ajax_url,
    type : 'post',
    data : {
      action : 'search_client',
      key : value,
    },
    success : function( response ) {
      response = jQuery.parseJSON(response);
      //console.log(response);
      $.each(result, function(k, v) {
       $('#search-results').append('<li><a href="#">' + v['Name'] + '</a></li>');
      });
    }
  });
});

第二个脚本获取单击的下拉结果的值,执行与第一个脚本相同的操作,只是这次使用ajax结果填充位于页面上的字段。

$(document.body).on('click','#search-results > li', function ( e ) {
//e.preventDefault();
value = $( this ).text(); //grab text inside element
  jQuery.ajax({
    url : ajaxsearch.ajax_url,
    type : 'post',
    data : {
      action : 'search_client',
      key : value,
    },
    success : function( response ) {
      response = jQuery.parseJSON(response);
      //console.log(response);
      $.each(response, function(k, v) {
        $('#clientID').val( v['ClientId'] );
        $('#denumire').val( v['Name'] );
        $('#cui').val( v['CUI'] );
        $('#regcom').val( v['JRegNo'] );
        $('#adresa').val( v['Address'] );
        $('#iban').val( v['IBAN'] );
        $('#banca').val( v['Bank'] );
        $('#telefon').val( v['Phone'] );
        $('#pers-contact').val( v['Contact'] );
      });
    }
  });
});

是否有一种方法可以将第二个脚本合并到第一个脚本中,这样就不会进行第二个ajax调用,而是能够根据下拉列表中的单击结果填充第一个ajax调用的结果在页面上的字段?

如果您从v['Name']插入到第一个脚本中的列表项的文本与您想要在第二个脚本中在页面其他地方使用的内容完全相同,则可以减少代码方式,方式下降。毕竟,如果你已经有了你想要的值,就没有必要再去搜索它。

//first function, just the relevant bits...
$.each(result, function(k, v) {
    var newItem = $('<li><a href="#">' + v['Name'] + '</a></li>');
    $.data(newItem, "value", v);
    $('#search-results').append(newItem);
});

//second function, the whole thing
$(document.body).on('click','#search-results > li', function ( e ) {
    e.preventDefault();
    var v = $.data($( this ), "value");    //grab object stashed inside element
    $('#clientID').val( v['ClientId'] );
    $('#denumire').val( v['Name'] );
    $('#cui').val( v['CUI'] );
    $('#regcom').val( v['JRegNo'] );
    $('#adresa').val( v['Address'] );
    $('#iban').val( v['IBAN'] );
    $('#banca').val( v['Bank'] );
    $('#telefon').val( v['Phone'] );
    $('#pers-contact').val( v['Contact'] );
});

这应该允许您将整个结果对象存储到列表项中,然后稍后检索它。如果列表中有一些元素没有放到搜索中,那么你还需要做更多的工作来获取相关数据

相关文章: