2010-03-13 6 views
0

У меня есть код, который будет вызывать $ .load(), чтобы получить фрагмент HTML. В фрагменте будет список изображений и сценарий, который будет выполнять некоторые вычисления на основе размера списка. Фрагмент выглядит какjQuery Ошибка загрузки изображений Ajax проблемы

<div> 
    <ul> 
    <li><img .../></li> 
    <li><img .../></li> 
    ... 
    </ul> 
</div> 

<script> 
    //... script to do calculation on the list width 
</script>  

Первоначально я использую максимальную ширину css, чтобы изображение не превышало 180 пикселей. Но поскольку IE не имеет максимальной ширины, я использую выражение hack. Однако, кажется, когда изображение является первой загрузкой, сценарий не может получить правильную ширину списка изображений. Похоже на загрузку скрипта раньше, чем выражение CSS.

Если это новая страница, я могу, конечно, вызвать $ (window) .load(), чтобы обеспечить загрузку всех изображений. Но что я могу сделать в запросе ajax html-фрагмента?

ответ

1

ДЕМО:http://jsbin.com/ehawa/2

метод для Java-offsetWidth

х годов:. Document.getElementById ("UL_ID") offsetWidth

Пример рабочего кода с jQuery:

 <style> 
     ul { list-style:none; margin:0; padding:0 } 
     ul li { margin:10px } 
     ul li img { /* width:180px */ } 
     div { float:left; width:200px; background:#333 } 
     </style> 

     <script> 
    $(function() { 

     setImgWidth(); 

    }); 

// then Insert the same function After the Ajax Call 

function setImgWidth() { 

    $('ul li > img').each(function() { 
     //get it's width 
     var img = $(this).width(); 
     if (img > 180) { 
      $(this).attr('style', 'width:180px'); 
     } 
    }); 

} 
     </script> 


    <div> 
     <ul> 
     <li><img src="http://l.yimg.com/g/images/home_photo_junku.jpg" alt=""/></li> 
     <li><img src="http://l.yimg.com/g/images/home_photo_tarotastic.jpg" alt=""/></li> 
     </ul> 
    </div> 

надеюсь, что эта помощь!

+0

Нет. Фактически я вычисляю ширину ul, где lis внутри плавают слева. Ли содержит изображение с свойствами max-width css. Но поскольку IE не имеет максимальной ширины, я должен использовать выражение: this.width <180? this.width: 180; Проблема заключается в том, что выражение для нового изображения оценивается после сценария, поэтому вычисляемая ширина не всегда корректна. – jackysee

+0

в сценарии ajax вам просто нужно поставить вызов jquery выше внутри функции и вызвать его после запроса ajax, он должен работать должным образом! Дай мне знать! –

Смежные вопросы