jQuery更改事件只触发三个元素中的一个

我有以下问题。我每次更改我的HTML代码中显示的元素中的一个“validate”类时，我应该激活我的jQuery更改事件。jQuery更改事件只触发三个元素中的一个

HTML代码

<div class="controls form-inline"> 
    <label for="ff_elem295" id="bfLabel295" class="control-label"><i class="icon-asterisk"></i> <?php echo JText::_('COM_CSTUDOMUS_DIRECCION'); ?></label> 
    <input type="text" id="ff_elem295" value="<?php echo $post['direccion'] ? $post['direccion'] : "";?>" name="direccion" class="validation ff_elem inputbox required" required="required"> 
</div> 

<div class="controls form-inline"> 
    <label for="ff_elem305" id="bfLabel305" class="control-label"><i class="icon-asterisk"></i> <?php echo JText::_('COM_CSTUDOMUS_PROV'); ?></label> 

    <span id="idPro" data-attr='class="validation required" required="required"'></span> 
     <select id="id_provincia" name="id_provincia"> 
       <option value="" selected="selected"><?php echo JText::_('COM_CSTUDOMUS_SELECT_PROVINCIAS');?></option> 
     </select> 
</div> 

<div class="controls form-inline"> 
    <label for="ff_elem306" id="bfLabel306" class="control-label"><i class="icon-asterisk"></i> <?php echo JText::_('COM_CSTUDOMUS_MUNI'); ?></label> 

    <span id="idMun" data-attr='class="validation required" required="required"'></span> 
     <select id="id_municipio" name="id_municipio"> 
      <option value="" selected="selected"><?php echo JText::_('COM_CSTUDOMUS_SELECT_MUNICIPIOS');?></option> 
     </select> 
</div>

的事件，当你在输入框中写的，当你改变国家或州/省它永远不会触发只触发。

JS代码

jQuery(document).ready(function() { 

    var direccion=""; 
    var flag = false; 
    jQuery(".validation").change(function() { 
     flag = true; 
     alert("change"); 
     jQuery(".validation").each(function() { 
      if (jQuery(this).val().trim() == "") { 
       flag = false; 
      } 
     }); 
     if (flag==true) { 
      alert("true"); 
      var calle = jQuery("#ff_elem295").val(); 
      var municipio = jQuery("#id_municipio option:selected").text(); 
      var provincia = jQuery("#id_provincia option:selected").text();    

      direccion = calle +","+ municipio +","+ provincia; 
      direccion = direccion.replace(/\s/g,'+'); 

      jQuery.ajax({ 
       url: "index.php?option=com_cstudomus&controller=saloninmobiliarios&task=calcularDistancias", 
       data : {direccion : direccion} 
      }).done(function(data){ 
       var sitios = data.split(','); 
        jQuery("#ff_elem245").val(sitios[7]); //Supermercado 
        jQuery("#ff_elem251").val(sitios[0]); //Centro Comercial 
        jQuery("#ff_elem252").val(sitios[1]); //Colegio 
        jQuery("#ff_elem254").val(sitios[4]); //Centro Ciudad 
        jQuery("#ff_elem259").val(sitios[5]); //Autobús 
        jQuery("#ff_elem261").val(sitios[3]); //Metro 
        jQuery("#ff_elem263").val(sitios[2]); //Aeropuerto 
        jQuery("#ff_elem267").val(sitios[6]); //Ambulatorio 
      }); 
     }  
    }); 
});

我认为问题是出类“验证”被分配到选择栏后，您选择的国家。同样的事情发生在城市。看起来，更改事件指向第一个已被销毁的对象，即使其后创建（它仍然指向前一个）。

我该如何解决这个问题？

来源

2014-03-05 PLATANIUM

我已经尝试用更改事件中的这些字段的每个id替换类“验证”，并且相同的问题产生器 – PLATANIUM

试试'jQuery（document）.on（'change'，'.validation'，function（）{...' – adeneo

@adeneo完美无缺！哈哈，把它作为anwser请把它，所以我可以投票:) – PLATANIUM

事件处理程序只处理绑定事件处理程序时匹配选择器的元素。如果您稍后要更改类并期望事件处理程序正常工作，则必须将其委托给父元素。

jQuery(document).on('change', '.validation', function() { 

    // code here 

});

你应该选择更接近限制集合的父元素，像

jQuery('.controls').on('change', '.validation', function() { ...

来源

2014-03-05 17:27:23 adeneo

一个Dcocument.ready

$(document).on('change', '.classname', function() {

}

内这项工作对我来说

来源

2016-05-06 15:16:38

jQuery更改事件只触发三个元素中的一个

回答

相关问题