0

我正在一个弹出旧js的程序中工作，我正在尝试将它放入一个jQuery模式窗口，我遇到的问题是获取img大小。

这是24 小时演示

原来的脚本是这样的：

<script type="text/javascript">
  <!--
    function newWin(strURL,imgheight,imgwidth) {
    var mybar='toolbar=no,directories=no,status=no,menubar=no,resizable=no';
    mybar+=',width=';
    mybar+=imgwidth;
    mybar+=',height=';
    mybar+=imgheight;

    window.open(strURL, 'newWin', mybar);
  }
//-->
</script>

..和 HTML get 是这样写的：

<div id="TMBOBJ7DD361E59F1760" style=" position:absolute; top:201px; left:79px; width:150px; height:96px;  z-index:4;" >
<a href="nextpop/imag001A.html" onclick="newWin('nextpop/imag001A.html',408,630);return false;" target="_blank">
<img src="nextpop/imag001.jpg" width=150 height=96 border=0 alt="Mustang">
</a>
</div>

现在我有了它，所以它都可以用这个 jQuery 进行转换，正如你在 DEMO 中看到的那样

$(document).ready(function() {

$('[id^=TMBOBJ]').each(function() {
var $a = $(this).find('a');
$a.attr('href' , $a.attr('href').replace('html', 'jpg' ));
$a.removeAttr('onclick');
$a.removeAttr('target');
});

$(function () {
var top = Math.max($(window).height() / 2 - $("#large")[0].offsetHeight / 2, 0);
var left = Math.max($(window).width() / 2 - $("#large")[0].offsetWidth / 2, 0);
$("#large").css('top', top + "px");
$("#large").css('left', left + "px");
$("#large").css('position', 'fixed');
});

$('#background').each(function() {
$(this).css('height',$(document).height());
$(this).css('width',$(document).width());
});

$('[id^=TMBOBJ] img').click(function(){

$("#background").css({"opacity" : "0.7"})
.fadeIn("slow");

$("#large").html("<img src='"+$(this).parent().attr("href")+"' alt='"+$(this).attr("alt")+"' /><br/>"+$(this).attr("alt")+"")
.fadeIn("slow");
return false;
});

$("#background").click(function(){
$("#background").fadeOut("slow");
$("#large").fadeOut("slow");
});

$("#large").click(function(){
$("#background").fadeOut("slow");
$("#large").fadeOut("slow");
});

});

除了我无法弄清楚如何获得 img 大小任何想法对于像我这样的初学者来说这是一个艰难的想法。我试过这个：

$("img").load(function(){
    var img = document.getElementById('[id^=TMBOBJ]'); 
    var width = img.clientWidth;
    var height = img.clientHeight;
});

但是我需要从原始脚本中获取大小是我在想的吗？我知道......但它会帮助更新人们的所见即所得程序，我很接近（事实证明，这也是一个有趣的问题）。

4

1 回答 1

2

document.getElementById('[id^=TMBOBJ]');是一个问题/不会像预期的那样工作ID，而不是查询选择器。

要么让它成为一个 jQuery 选择器：

var img = $('[id^=TMBOBJ]');

或使用document.querySelectorAll()

var img = document.querySelectorAll('[id^=TMBOBJ]')

这两个选择器都将返回一个 DOM 元素数组，因此您的加载函数应该被修改，或者简单地$(this)用于您的范围。

此外，充分发挥 jQuery 的潜力！

$("img").load(function(){
    var img = $(this),
        width = img.outerWidth(true),
        height = img.outerHeight(true);
});
于 2013-03-31T05:36:20.290 回答