我希望我的文本字段使用 jQuery 显示在我的模式中。我该如何修复该代码？如果我选中复选框，它将显示在我的模式中。但如果我使用我的文本字段，它什么也不会显示。
正文
<body>
<div id="hasildetail" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Detail</h4>
</div>
<div class="modal-body">
<p id="isidetail">
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="row">
<div class="offset-4 col-sm-8">
<form>
<h3>Please select:</h3>
<input type="checkbox" name="hobby" value="Sepak Bola"> Sepak Bola <br>
<input type="checkbox" name="hobby" value="Membaca"> Membaca <br>
<input type="checkbox" name="hobby" value="Menulis"> Menulis <br>
<input type="checkbox" name="hobby" value="Memancing"> Memancing <br>
<input type="checkbox" name="lainlain" id="lainlain" value="Lain-lain"> Lain-lain <br>
<input type="text" id="ceklain" placeholder="[ Masukkan lain-lain ]">
</form>
<button id="detail" type="button" class="btn btn-primary" data-toggle="modal" data-target="#hasildetail">Detail</button>
</div>
</div>
</body>
脚本
// Tampil ke modal detail
$(document).ready(function() {
$("#detail").click(function() {
var p = $("#hasildetail #isidetail");
$(p).html("<h4>you have selected : </h4>");
$.each($("input[name='hobby']:checked"), function() {
$(p).html($(p).html() + '<br>' + $(this).val());
});
});
});
// Checkbox Lain-lain
$(document).ready(function() {
$('#ceklain').hide();
$('#lainlain').change(function() {
if (this.checked)
$('#ceklain').show(1000);
else
$('#ceklain').hide(1000);
});
});
最佳答案
[1] 您只能使用一个 $(document).ready()
[2] 无需使用类似 $(p).html() + '<b>'... 的内容您可以添加HTML Structure到变量然后使用 .html(HTMLStructure)将 html 结构添加到元素..这可以通过 .append() 来完成也是..
[3] 虽然 id 应该是唯一的，并且您有所需输入的 id，所以您可以通过使用 $('#ceklain').val() 获取其值
$(document).ready(function() {
// Tampil ke modal detail
$("#detail").click(function() {
var p = $("#hasildetail #isidetail");
var HTMLStructure = "<h4>you have selected : </h4>";
$.each($("input[name='hobby']:checked"), function() {
HTMLStructure += '<br>' + $(this).val();
});
HTMLStructure += $('#ceklain').val();
$(p).html(HTMLStructure);
});
// Checkbox Lain-lain
$('#ceklain').hide();
$('#lainlain').change(function() {
if (this.checked)
$('#ceklain').show(1000);
else
$('#ceklain').hide(1000);
});
});
关于javascript - 我如何从输入文本中获取值并显示到我的模式中？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56121573/