0

这是另一个问题的延续：jquery automatic image reload on src attribute update?

使用以下代码，即使图像似乎不在 DOM 中，我也会收到新图像 src 位置的 AJAX GET 调用：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready( function(){
            $('#button').click( function(){
                var $container = $('#container');
                var string = $container.html();
                string = string.toString();
              var $string = $(string);
                $string.attr('src', 'foo');
            });
        });
    </script>
</head>
<body>
    <div id='container'><img src='pointIcon.png'/></div>
        <button id='button'>Go!</button>
</body>
</html>

关于如何在不触发 AJAX 调用的情况下操作 $string 对象的任何想法？已经尝试过.toString()、.stopPropogation()，到目前为止没有运气...

4

3 回答 3

1

您可以尝试将其包装在 <div style='display:none'> 中，以便在将字符串解析为 DOM 元素时不可见，这可能会阻止浏览器加载图像。如果没有，您将不得不使用字符串操作而不是 jQuery 来操作它，因为 $(string) 将为您创建 DOM 元素，这会导致创建图像然后请求图像

于 2012-09-10T14:59:56.633 回答
0

尝试：

var string=$("#container img");
string.attr('src', 'foo');

代替：

var string = $container.html();
string = string.toString();
var $string = $(string);
$string.attr('src', 'foo');

演示：http: //jsbin.com/igitox/1/edit

于 2012-09-10T15:01:39.230 回答
0 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready( function(){
            $('#button').click( function(){
                var image = $('#container img');
                image.attr('src', 'foo');
            });
        });
    </script>
</head>
<body>
<div id='container'><img src='pointIcon.png'/></div>
    <button id='button'>Go!</button>
</body>
</html>
于 2012-09-10T15:03:13.403 回答