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更改事件只觸發三個元素中的一個

回答

相關問題