呼叫的jQuery（jQuery的移動）

我有動態創建5個collapsibles（內部的可摺疊）以下jQuery函數：呼叫的jQuery（jQuery的移動）

$(function() { 
var key, value; 
var Storage = 5 
// loop through local storage 
for (var i = 0; i < Storage; i++) { 
// retrieve the key 
key = i; 
// set the field from the key 
value = "Medicine" + i.toString(); 

//$("#medListDiv").show(); 
var text = '<div data-role="collapsible" data-collapsed="true" data-iconpos="right">' + '<h2>' + value + '</h2>' + '<input id="number' + i.toString() + '" type="text" placeholder="Quantity" />' + '<textarea cols="40" rows="4" placeholder="Type any directions written on your prescription for the above medicine." ></textarea></div>'; 
$("#medListDiv div:first").append(text); 
} 

$('#medListDiv').find('div[data-role=collapsible]').collapsible(); 
$('#medListDiv').trigger("create"); 

});

上面的代碼設定不同id到每個textbox（通知'<input id="number' + i.toString() + '" type="text" placeholder="Quantity" />' ）。

我現在的問題是，我想這些文本框只接受數字（全數字只有 - 沒有小數），所以我想出了（找到）用下面的函數時，給出一個「靜態」的ID完美的作品：

$("#number0").on('keypress', function(ev) { 
var keyCode = window.event ? ev.keyCode : ev.which; 
//codes for 0-9 
if (keyCode < 48 || keyCode > 57) { 
    //codes for backspace, delete, enter 
    if (keyCode != 0 && keyCode != 8 && keyCode != 13 && !ev.ctrlKey) { 
     ev.preventDefault(); 
    } 
} 
});

我一直在試圖使此功能取任何id取決於用戶選擇textbox。

這Fiddle我只顯示5 collapsibles但我的原始程序需要用戶輸入和藥物的數量可能會有所不同。請注意，第一個Quantity文本框不會允許任何字母。我希望所有Quantity文本框的行爲方式相同。

我也嘗試了不同的功能，添加了var qtyID = $(this).attr(i);，因此刪除了沒有數字的任何輸入，但似乎沒有做這項工作。

$(document).ready(function() { 
    var qtyID = $(this).attr(i); 
    $("#number" + qtyID).keypress(function (e) { 
    var value = $(this).val(); 
    value = value.replace(/[^0-9]+/g, ''); 
    $(this).val(value); 
    }); 
});

我也試過把整個函數放在主函數裏面，但根本沒有幫助。基本上所有我想要的是能夠get動態創建id從那些textboxes，所以我可以調用他們的一個小函數，但無數的例子，我看到了網上如何做到這一點，我無法設法得到它工作。

任何建議將不勝感激。

來源

2013-11-22 Scur4

不要使用'。就緒（）'在JQM。 – Omar

您的問題是您在第一次輸入數量時唯一調用該功能。不要按ID選擇輸入，而要按類別選擇。

爲每個輸入添加number class。

var text = '<div data-role="collapsible" data-collapsed="true" data-iconpos="right">' + '<h2>' + value + '</h2>' + '<input id="number' + i.toString() + '" class="number" type="text" placeholder="Quantity" />' + '<textarea cols="40" rows="4" placeholder="Type any directions written on your prescription for the above medicine." ></textarea></div>';

然後呼籲class，而不是哪一個適用於所有量輸入，而不只是第一個的id你的函數。

$(".number").on('keypress', function(ev) { 
    var keyCode = window.event ? ev.keyCode : ev.which; 
    //codes for 0-9 
    if (keyCode < 48 || keyCode > 57) { 
     //codes for backspace, delete, enter 
     if (keyCode != 0 && keyCode != 8 && keyCode != 13 && !ev.ctrlKey) { 
      ev.preventDefault(); 
     } 
    } 
});

http://jsfiddle.net/PU4UC/1/

來源

2013-11-22 19:12:03 Trevor

謝謝你的解決方案，是的，我意識到我只是要求第一批量輸入，這樣做是爲了展示我想要的全部內容。這個解決方案可以解決這個問題。謝謝！ :) - 另外，如果它沒有太多要求，是否有一個原因，爲什麼上述功能將無法在移動模擬器上工作？（歌劇，具體）。它確實在瀏覽器上工作。 – Scur4

事件委託：

$('#medListDiv').on('keypress', '#number0', function(ev) {

你處理程序被在運行時間限制，並且不知道這些動態創建的元素。綁定到運行時存在的元素。

來源

2013-11-22 19:09:34 tymeJV

試試這個： JQuery的：

$(document).ready(function() { 
     $('body').on('keydown', ".number", function (event) { 

      if (event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 || 
       // Allow: Ctrl+A 
        (event.keyCode == 65 && event.ctrlKey === true) || 

       // Allow: home, end, left, right 
        (event.keyCode >= 35 && event.keyCode <= 39)) { 
       // let it happen, don't do anything 
       return; 
      } else { 
       // Ensure that it is a number and stop the keypress 
       if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105)) { 
        event.preventDefault(); 
       } 
      } 
     }); 
    });

HTML：

<td><input type=text id=Qty_' + ID + ' class="number"/></td>'

來源

2015-06-02 05:07:24 Raj

呼叫的jQuery（jQuery的移動）

回答

相關問題