我在添加没有 jquery 主题的元素后遇到问题。我尝试手动应用主题,但仍然无法使用输入框和选择框。有什么方法可以解决这个问题,或者我是如何编写如何附加元素的代码的方法是错误的。删除按钮的代码也不起作用
这是我的javascript代码:-
$(window).on('pageinit', function() {
$(document).ready(function(){
$("#Sadd").click(function() {
var tDiv = $('#GPA1');
var i = $('#GPA1 h1').size() + 1;
$('<li class="ui-li-static ui-body-inherit" style="border:none"><h1>Module ' + i +':</h1></li><li class="ui-field-contain ui-li-static ui-body-inherit" data-role="fieldcontain" style="border:none"><label for="Sc' + i +'">Credits:</label><input type="number" step="0.01" id="Sc' + i +'" name="Sc' + i +'" data-clear-btn="true"></li><li class="ui-field-contain ui-li-static ui-body-inherit ui-last-child" data-role="fieldcontain" style="border:none"><label for="Sgrade' + i +'" class="select">Grade:</label><select class="Sgrade' + i +'" data-theme="f" id="Sgrade' + i +'"><option value="-1">—</option><option value="4">A</option><option value="3.7">A-</option><option value="3.3">B+</option><option value="3">B</option><option value="2.7">B-</option><option value="2.3">C+</option><option value="2">C</option><option value="1.7">C-</option><option value="1.3">D+</option><option value="1">D</option><option value="0">F</option></select></li>').appendTo(tDiv);
i++;
return false;
});
$("#Sremove").click(function() {
var i = $("#GPA1 h1").length();
if( i > 5 ) {
$(this).parents('h1').remove();
i--;
}
return false;
});
});
});
这是我的 html 和 javascript 的演示,只需单击添加按钮,您就会看到结果
最佳答案
div 标签有问题你没有在里面添加 div 标签 即使我已经在 http://jsfiddle.net/tny5mh2n/2/ 中更新,也请尝试用这个替换
$('<li class="ui-li-static ui-body-inherit" style="border:none"><h1>Module ' + i +':</h1></li><li class="ui-field-contain ui-li-static ui-body-inherit" data-role="fieldcontain" style="border:none"><label for="Sc' + i +'">Credits:</label><div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset ui-input-has-clear"><input type="number" step="0.01" id="Sc' + i +'" name="Sc' + i +'" data-clear-btn="true"><a href="#" class="ui-input-clear ui-btn ui-icon-delete ui-btn-icon-notext ui-corner-all ui-input-clear-hidden" title="Clear text">Clear text</a></div></li><li class="ui-field-contain ui-li-static ui-body-inherit ui-last-child" data-role="fieldcontain" style="border:none"><label for="Sgrade' + i +'" class="select">Grade:</label><div class="ui-select"><div class="ui-btn ui-icon-carat-d ui-btn-icon-right ui-btn-f ui-corner-all ui-shadow" id="Sgrade5-button"><span class="Sgrade5">—</span><select class="Sgrade' + i +'" data-theme="f" id="Sgrade' + i +'"><option value="-1">—</option><option value="4">A</option><option value="3.7">A-</option><option value="3.3">B+</option><option value="3">B</option><option value="2.7">B-</option><option value="2.3">C+</option><option value="2">C</option><option value="1.7">C-</option><option value="1.3">D+</option><option value="1">D</option><option value="0">F</option></select></div></div></li>').appendTo(tDiv);
关于javascript - 添加新元素后 Jquery 主题不适用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33686905/