0

我正在尝试做一个简单的程序,用户可以在其中填写可以输入文本并选择图像(网址或本地)并在下面的 div 中显示所选信息。我是用现有的 div 制作的,但如果我们不知道用户将插入多少次信息,则不可能这样做。

因此,如何创建一个 div 并在其中插入内容呢?

User:
<div>
  <input type="text" id="user">Add image
  <form id="image">
        <input type="radio" name="radio" value="url">URL
        <input type="radio" name="radio" value="local">PC
  </form>
  <input type="text" id="url" style="display:none">
  <input type="file" id="local" style="display:none">
  <br>
  <button id="submit">Submit</button>
  <div id="enter"></div>
  <p id="p1"></p>
</div>

jQuery:

 $(document).ready(function () {
    $('#image input').on('change', function () {
        if ($('input[name=radio]:checked', '#image').val() == "url") {
            $("#url").css('display', 'block');
            $("#local").css('display', 'none');
        } else if ($('input[name=radio]:checked', '#image').val() == "local") {
            $("#url").css('display', 'none');
            $("#local").css('display', 'block');
        }
    });

    $("#submit").click(function () {
        $("#p1").text($("#user").val());
if($("#url").css('display', 'none')==true){
$("#enter").append("img").prop("src", file.val());
}else{
$("#enter").append("img").prop("src", url.val());
}
    });
});
4

2 回答 2

3

也许试试这个:

$("#enter").append("<img src='" + $("#url").val() + "'>");

Plunker 示例

于 2013-11-06T22:26:39.340 回答
0

jQuery 为您提供了许多创建元素的方法。您可以使用选择器创建它$.fn

$("<div>", {
    class: "Your custom classes",
    id: "random",
    style: "border: none",
    anyAttribute: "itsValue"
}).addClass("itsChainable")
.html("<a href=\"nowhere.com\">Im a link!!</a>")
.appendTo("body")
于 2013-11-06T22:18:32.650 回答