我试图将html元素动态添加到div中,但我根本无法这样做。我用var s='<a href='+hrf+'><img src='+hrf+'alt="Tulips"></a>';替换了var s = '<button>click</button>';只是为了检查我要附加的字符串是否有问题并且仍然没有运气。

头文字

   <script type="text/javascript">

       window.onload = GetRecords();

            function GetRecords() {
                $.ajax({
                    type: "POST",
                    url: "Gallery.aspx/insertimg",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: OnSuccess,
                    failure: function (response) {
                        alert(response.d);
                    },
                    error: function (response) {
                        alert(response.d);
                    }
                });
            }

        function OnSuccess(response) {

            var xmlDoc = $.parseXML(response.d);
            var xml = $(xmlDoc);
            var count = parseInt(xml.find("imgtable").length);
            var imageTable = xml.find("imgtable");

            for (var i = 0; i < count; i++) {
              var hrf = imageTable.find("ImageUrl").eq(i).text();
             var s='<a href='+hrf+'><img src='+hrf+'alt="Tulips"></a>';
              $('.html5gallery').append(s);

            }
        }

</script>


身体

<body>
    <div style="display:none; flex-align:center" class="html5gallery" data-skin="horizontal" data-width="480" data-height="272">
   </div>
</body>


XML格式

<NewDataSet>
  <imgtable>
    <PhotoId>4</PhotoId>
    <Name>Photo4</Name>
    <ImageUrl>photoalbum/DSCN5798.jpg</ImageUrl>
    <AlbumId>2</AlbumId>
    <Date>2013-04-03T17:03:02+05:30</Date>
  </imgtable>
  <imgtable>
    <PhotoId>5</PhotoId>
    <Name>Photo5</Name>
    <ImageUrl>photoalbum/DSCN5799.jpg</ImageUrl>
    <AlbumId>2</AlbumId>
    <Date>2013-04-03T17:03:13+05:30</Date>
  </imgtable>
  <imgtable>
    <PhotoId>6</PhotoId>
    <Name>Photo6</Name>
    <ImageUrl>photoalbum/DSCN5800.jpg</ImageUrl>
    <AlbumId>2</AlbumId>
    <Date>2013-04-03T17:03:13+05:30</Date>
  </imgtable>
</NewDataSet>


呈现的HTML

<body>
    <form method="post" action="gallery.aspx?albumid=2" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="5WcBQJLHmIC4X/c0os4kFsh4tUCcOP93YgL5uIChec+tPgpqBaWkU5jZaSmvwM4MMGjdK8G9LD+/HV8GvINckwe5HGGXFcY7BgEpkFo0CEM=" />
</div>
    <div style="display:none; flex-align:center" class="html5gallery" data-skin="horizontal" data-width="480" data-height="272"></div>
    </form>
</body>

最佳答案

您在window.onload = GetRecords();中有问题-应该是window.onload = GetRecords;

同样在ajax请求中,您说的响应是json,但在成功回调中,它被处理为XML

但在jQuery中,您也可以使用dom ready来实现相同的功能

jQuery(GetRecords)


使用window.onload = GetRecords();时,将执行GetRecords并将返回的值分配为onload处理程序,这不是必需的。所需的是在加载窗口后调用GetRecords,因为您需要使用window.onload将函数引用传递给window.onload = GetRecords;

尝试

jQuery(GetRecords)

function GetRecords() {
    $.ajax({
        type : "POST",
        url : "Gallery.aspx/insertimg",
        contentType : "application/json; charset=utf-8",
        dataType : "xml",
        success : OnSuccess,
        failure : function(response) {
            alert(response.d);
        },
        error : function(response) {
            alert(response.d);
        }
    });
}

function OnSuccess(response) {

    var xmlDoc = $.parseXML(response.d);
    var xml = $(xmlDoc);
    var count = parseInt(xml.find("imgtable").length);
    var imageTable = xml.find("imgtable");

    for (var i = 0; i < count; i++) {
        var hrf = imageTable.find("ImageUrl").eq(i).text();
        var s = '<a href=' + hrf + '><img src=' + hrf + 'alt="Tulips"></a>';
        $('.html5gallery').append(s);

    }
}

08-03 22:00