目的:讓 JS 取用 HTML 模板時,可以正常使用
- innerhtml of a select tag does not update selected option
- JQuery setting the selected attribute on a select list
--
以下是一個簡單測試及實作,id="t" 是一個下拉的模板,想要根據這個模板將正確的值選擇後放在 id="h" 內
一般下拉選擇值不會用 .attr() 的方式都是直接使用 .val() 比較簡便,例如
1 |
T.find('[name="s"]').val(2); |
不過使用 .val() 卻不會改變 innerHTML,所以使用 .html() 就還是原來的樣子,必須使用 .attr() 才行
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script src="../Component_Front/jquery-1.11.3.min.js"></script> </head> <body> <div id="h"></div> <hr/> <div id="t"> <select name="s" id="ss"> <option value="">-</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> </div> <script> var T = $('#t').clone(); T.find('[name="s"]').find('option[value="2"]').attr("selected",""); $('#h').html(T.html()); </script> </body> </html> |
--
文字欄位的情況
TEXTAREA : 如果要填入 textarea 就要使用 .text()
INPUT="TEXT" : 文字欄位因為是使用 value="" 來給予值,所以要填入資料時必須使用 attr( 'value', '值' ) 的方式
也就是在 Template 使用的情況下一律不能使用 .val()
--
單選 Radio 的情況
1 2 |
var TP = $('#idTemplatePayment').clone(); TP.find('[name="PaymentMethod[{ID}]"][value="'+ v['PaymentMethod'] +'"]').attr('checked', true); |
--
1,913 total views, 1 views today