时间戳

首页 > 解决方案 > 清除textbox1时如何清除textbox2的值（在选择textbox1的自动完成时动态添加）

jquery - 清除textbox1时如何清除textbox2的值（在选择textbox1的自动完成时动态添加）

问题描述

我有一个文本框，在该文本框的自动完成中，我添加了更多带有值的文本框。

下面是代码。

 $(".autocomplete").autocomplete({
            source: function (request, response) {
                console.log(request.term);
                var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
                $.ajax({
                    type : 'POST',                                       
                    url : config.vnfURL + 'vnf/getPRIM',
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",
                     data: {
                      q: request.term
                      },
                    success: function (data) {
                        console.log(response);
                        response($.map(data, function(v,i){
                            var text = v.acronym;
                            var text2=v.functionDesignation;
                            if ( text && ( !request.term || matcher.test(text) ) ) {
                                return {
                                     label: v.acronym.concat("_", v.functionDesignation,"_",v.versionDesignationText, "_",v.rstate,"_",v.productNumber),                                     
                                      };
                            }
                        }));
                    }
                });
            },
            select: function (event, ui) {

                var primArray=ui.item.value.split('_');             
                event.preventDefault();             
                $("#emsProductName").val(primArray[1]);
                $("#emsRelease").val(primArray[2]);
                $("#emsRelease").prop('disabled', true);    

                if(!$('#emsdynamic').length){
                     var divHTML = '<div  id="emsdynamic">' +
                        '<div class="col-md-4 col-sm-4 col-xs-4">'+
                    '<label class="control-label">Product Number</label>'+
                    '<input type="text" class="form-control" id="emsProductNumber" disabled />'+
                    '</div>'+
                    '<div class="col-md-4 col-sm-4 col-xs-4">'+
                    '<label class="control-label">R State</label>'+
                    '<input type="text" class="form-control" id="emsRstate" disabled/>'+
                    '</div>'+
                    '</div>';
                    $("#emsDivision").append(divHTML);
                    $("#emsProductNumber").val(primArray[4]);
                    $("#emsRstate").val(primArray[3]);
                }
                else{
                    $("#emsProductNumber").val(primArray[4]);
                    $("#emsRstate").val(primArray[3]);
                }


            }
           /* change: function(e) {
                $('#emsProductNumber').val('');
                $("#emsRstate").val('');
                $('#emsRelease').val('');
                $("#emsRelease").prop('disabled', false);
                $("#emsdynamic").hide();
            }*/

        });

一切正常。现在，如果我清除自动完成文本框（emsProductName）的值，我如何清除动态创建的 tetxboxes 的值？

我已经尝试使用 Change 事件，但它没有按预期工作。

标签： jqueryjquery-ui-autocomplete

解决方案

你可以通过像fiddle这样的 keyup 来实现

$('.autocomplete').keyup(function(e) {
       if ($('.autocomplete').val() == '') {
         $('#emsProductNumber').val('');
         $("#emsRstate").val('');
         $('#emsRelease').val('');
         $("#emsRelease").prop('disabled', false);
         $("#emsdynamic").hide();
       }
    });

由于您隐藏在 clear 上，因此您必须在 else 上再次调用 show $("#emsdynamic").show(); // my assumption

推荐阅读