jquery val（）與埃裏克馬丁的簡單模態形式

Question

我使用埃裏克馬丁使用簡單模態形式時獲取文本字段值的問題。 $('#pcs_'+id).val();似乎什麼也沒有返回（變量_t下面是未定義的）。

是在「彈出」模式表單生成的HTML部分：

<form><input type="text" id="pcs_25" value="1"> pcs </form> 
<a id="add_basket_25" onclick="return add2Basket(25);" class="button basket_list options_true" href="/emarket/basket/put/element/25/">add to basket</a> 

JS部分：

function add2Basket(id){ 

    var _t = $('#pcs_'+id).val(); 
    _t = $.trim(_t); 

    var rege = /^[\d]{1,}$/; // numbers 
    if(rege.test(_t)){   //do something 
     var add2cartlink = $('#add_basket_'+id).attr('href'); 
     add2cartlink += _t; 
     // window.location.href = add2cartlink; 
     return false; 
    } 
    else { 
     alert("Only numbers allowed!"); 
     return false;   
    } 
} 

請注意，這只是正常工作之外的模態形式，並帶來如果在Modal表單容器中出現問題。

過去有沒有人遇到過這樣的事情？

新增：如果被明確，如$('#pcs_25').val()或$('#pcs_25').attr('value')，返回的是硬編碼到HTML部分的價值，這是<input type="text" id="pcs_25" value="1">。它似乎忽略手動輸入到文本字段中的值。

解決：我應該在此之前，簡單的模態副本已經猜到表單的輸入文本字段到生成的HTML，所以有在生成的HTML頁面其實2 id='pcs_25'元素。所以jquery選擇器需要更高的精度。 $('.simplemodal-data #pcs_'+id).val()解決了這個問題。

Answer 1

對於下面的HTML，我可以得到以下工作：

<form> 
    <input type="text" id="pcs_25" value="1"> pcs 
<a id="add_basket_25" class="button basket_list options_true" href="/emarket/basket/put/element/25/">add to basket</a> 
    <br/> 
    <input type="text" id="pcs_26" value="1"> pcs 
<a id="add_basket_26" class="button basket_list options_true" href="/emarket/basket/put/element/26/">add to basket</a> 

</form>​ 

具有以下簡化JavaScript，您可以無需任何正則表達式發展：

jQuery(".button.basket_list").click(function() { 
    event.preventDefault(); //stops the click from going through 
    //alert(jQuery(this).prev().val()); 
    var amountToAdd = parseInt(jQuery(this).prev().val()); //the parseint function will sometimes strip non numeric values off from the end of the text value 
    alert(amountToAdd); 
    if (amountToAdd) { 
      //window.location.href = jQuery(this).attr('href'); //If we still need to go somewhere 
    } 
    else 
    { 
     alert("Only numbers allowed!"); 
    } 
}); 

這只是選擇文本box元素之前的元素，並使用它的值。

在這裏看到的樣品： http://jsfiddle.net/webwarrior/Lbxj6/9/

如果你不想工作方式，然後添加的rel =「25」的超鏈接，並使用它，因爲我在下面的例子中那樣。 http://jsfiddle.net/webwarrior/L6PN5/3/

<form> 
    <input type="text" id="pcs_25" value="1"> pcs 
<a id="add_basket_25" class="button basket_list options_true" href="/emarket/basket/put/element/25/" rel="25">add to basket</a> 
    <br/> 
    <input type="text" id="pcs_26" value="1"> pcs 
<a id="add_basket_26" class="button basket_list options_true" href="/emarket/basket/put/element/26/" rel="26">add to basket</a> 

</form> 

和JavaScript：

jQuery(".button.basket_list").click(function() { 
    event.preventDefault(); //stops the click from going through 
    //alert(jQuery(this).prev().val()); 
    var ID = jQuery(this).attr('rel'); 
    var amountToAdd = parseInt(jQuery(".simplemodal-data #pcs_" + ID).val()); //the parseint function will sometimes strip non numeric values off from the end of the text value 
    alert(amountToAdd); 
    if (amountToAdd) { 
      //window.location.href = jQuery(this).attr('href'); //If we still need to go somewhere 
    } 
    else 
    { 
     alert("Only numbers allowed!"); 
    } 
});​ 

心連心