0

我想出了一段代码,允许用户在页面上创建自己的图片库。我希望用户能够放置他们自己的链接,并且我希望这些链接出现在他们创建的每个 img 标签内的 textarea 中,以便他们可以复制整个代码并将其粘贴到他们的页面上。但是,我想不出用他们粘贴的链接“抓取”每个输入的内容并将其放入 textarea 部分的标签中的方法。它总是显示第一个输入的内容。请问有什么帮助吗?:) 这是我到目前为止提出的代码:

 Image height: <input type="text" id="imgHeight" /><br /><br />
 Image width:  <input type="text" id="imgWidth" /><br /><br />
 Number of images: <input type="text" id="imgNo" /><br /><br />
 <p id="additionalImgs"></p>
    <input type="button" value="Show code" id="result" onclick="abba()" /><br /><br />  
    <textarea rows="20" cols="60" id="output"></textarea>
    <script>
    $(document).ready(function(){
        $("#result").click(function(){
            var imgHeight = $("#imgHeight").val();
            var imgWidth = $("#imgWidth").val();
            var imgNo = $("#imgNo").val();
            var text = '';
            var y = 1;
            for(i=0; i<imgNo; i++){
            var aaa = $("#additionalImgs input").val();
            text += "<img src='"+aaa +"' width='"+imgHeight+"' height='"+imgWidth+"' name='"+ y++ +"' />";
}
$('#output').text(text);

            });
        });
$(document).ready(function(){
            $("#imgNo").change(function(){
                var imgNo = $("#imgNo").val();
                x = 1;
                var y = 1;
                var text = "Image number: ";
                for(i=0; i<imgNo; i++){
                $("#additionalImgs").append(text + y++ + ' link' + "<input type='text' name='"+ x++  +"'><br />")};
                });
            });

    </script>
4

2 回答 2

1

更改此行对我有用:

    var aaa = $("#additionalImgs input")[i].value;
于 2013-05-10T13:28:48.660 回答
0

您需要区分您生成的输入字段。

试试这个小提琴

代码复制如下以供将来参考。请注意,生成的输入字段有一个名为“field_#”的唯一 ID。而当您想要检索该值时,您还需要获取具有唯一 id 的字段的值。

Image height:
<input type="text" id="imgHeight" />
<br />
<br />Image width:
<input type="text" id="imgWidth" />
<br />
<br />Number of images:
<input type="text" id="imgNo" />
<br />
<br />
<p id="additionalImgs"></p>
<input type="button" value="Show code" id="result" onclick="abba()" />
<br />
<br />
<textarea rows="20" cols="60" id="output"></textarea>
<script>
    $(document).ready(function() {
        $("#result").click(function() {
            var imgHeight = $("#imgHeight").val();
            var imgWidth = $("#imgWidth").val();
            var imgNo = $("#imgNo").val();
            var text = '';
            var y = 1;
            for (i = 0; i < imgNo; i++) {
                var aaa = $("#additionalImgs input#field_" + i).val();
                text += "<img src='" + aaa + "' width='" + imgHeight + "' height='" + imgWidth + "' name='" + y+++"' />";
            }
            $('#output').text(text);

        });

        $("#imgNo").change(function() {
            var imgNo = $("#imgNo").val();
            x = 1;
            var y = 1;
            var text = "Image number: ";
            for (i = 0; i < imgNo; i++) {
                $("#additionalImgs").append(text + y+++' link' + "<input id='field_" + i + "' type='text' name='" + x+++"'><br />")
            };
        });
    });
</script>
于 2013-05-10T13:20:32.840 回答