Onclick with facebox не работает в IE8

Question

Я работаю над сайтом, который включает Facebox для загрузки содержимого для процесса корзины.

При добавлении чего-то в корзину и нажатии зеленой кнопки списка желаний у меня возникают проблемы с загрузкой в ​​IE8, она работает на всех современных браузерах. Может ли кто-нибудь понять, почему он не будет загружать контент в IE8 в facebox?

Я использую этот код на кнопку желаний:

<div onclick="location.href='wishlist.php?basket=true'" rel="msgbox" id="mybasket"> 

достаточно ли информации, чтобы посмотреть на источник ссылку на сайт? Если вам нужен еще один код, спросите пожалуйста.

На Mac с помощью Chrome - как вы можете видеть, макияж отлично открыт при нажатии на зеленую кнопку списка желаний.

На компьютере, использующем IE8 - при нажатии на зеленую кнопку списка желаний открывается маска, но не загружается содержимое.

Answer 1

Это проблема с возвращенными данными. У вас есть дополнительный </div> в конце.

<div id="msgbox_title">Your Wish List<div id="closeme" onclick="jQuery(document).trigger('close.facebox')">x</div></div> 
<form method="post" action="wishlist.php"> 
<div id="msgbox_body" style="max-height:400px;min-height:100px;overflow-y:auto;overflow-x:hidden;"> 
<input type="hidden" name="updatebasket" value="1" /> 
<table border="0" cellpadding="0" cellspacing="5" align="center" style="min-width:390px;border-collapse:separate!IMPORTANT;"> 
<tr><td colspan="5" style="text-align: left;"><strong style="font-size:14px;">Rotunda Vulsellum Forceps</strong></td></tr> <tr> 
     <td style="width: 50px;"><span style="color: #aaa;">Quote:</span></td> 
     <td style="width: 50px;"><span style="color: #aaa;">Sample:</span></td> 
     <td style="width: 350px;"><span style="color: #aaa;">Description:</span></td> 

     <td style="width: 80px;"><span style="color: #aaa;">Pack size:</span></td> 
     <td style="width: 40px;"><span style="color: #aaa;">Remove</span></td> 
    </tr> 

     <tr> 
      <!-- <td style="padding:0px 2px;"><input type="textbox" class="textbox" value="3" name="54_59_131" /></td> --> 
      <td align="center" valign="middle" style="background-color:#C3DCCD;"><input checked="checked" style="margin:5px;" type="checkbox" name="products-quote[]" value="835" /></td> 
      <td align="center" valign="middle" style="background-color:#D3C4DF;"><input checked="checked" style="margin:5px;" type="checkbox" name="products-sample[]" value="835" /></td> 

      <td style="font-size:11px;background-color:#efefef;"><p style="margin:0px 0px 5px 0px;padding:5px;"><span style="color:#663399;font-weight:bold;">VFR1001</span> Sterile Single-use Rotunda Vulsellum Forceps, double packed</p></td> 
      <td style="font-size:11px;background-color:#efefef;"><p style="margin:0px 0px 5px 0px;padding:5px; font-weight:bold;">10 units</p></td> 
      <td align="center"><b><a href="#" onclick="jQuery.facebox({ ajax: 'wishlist.php?basket=true&del=835' })">X</a></b></td> 
     </tr> 
     </table> 
</div> 
<script> 
function quoteme() { 
     $("#msgbox_body").html('<div id="contactform" style="margin-left:20px;margin-right:20px;margin-top:10px;"><form class="form" method="POST" action="http://www.dtrmedical.com"><table border="0"><tbody><tr><td><p class="name"><label for="name">Your Name<span style="color:red;">*</span>:</label></p></td><td>&nbsp;</td><td><input type="text" name="name" id="name" /></td></tr><tr><td><p class="hospital"><label for="hospital">Hospital/Institution:</label></p></td><td>&nbsp;</td><td><input type="text" name="hospital" id="hospital" /></td></tr><tr><td><p class="department"><label for="department">Department:</label></p></td><td>&nbsp;</td><td><input type="text" name="department" id="department" /></td></tr><tr><td><p class="email"><label for="email">E-mail<span style="color:red;">*</span>:</label></p></td><td>&nbsp;</td><td><input type="text" name="email" id="email" /></td></tr><tr><td><p class="tel"><label for="tel">Telephone<span style="color:red;">*</span>:</label></p></td><td>&nbsp;</td><td><input type="text" name="tel" id="tel" /></td></tr><tr><td colspan="3" align="center"><p class="submit"><input style=\"margin-left:27px;cursor:pointer;\" onclick="jQuery.facebox({ ajax: (\'wishlist.php?emailme=true&name=\' + this.form.name.value + \'&email=\' + this.form.email.value + \'&tel=\' + this.form.tel.value + \'&hospital=\' + this.form.hospital.value + \'&department=\' + this.form.department.value) }); return false;" type="submit" value="Send enquiry" name="submit" /></p></td><td>&nbsp;</td><td>&nbsp;</td></tr></tbody></table></form></div>'); 
     $("#msgbox_actions").html('<input onclick="jQuery.facebox({ ajax: \'wishlist.php?basket=true\' })" type="button" value="Back to Wishlist" />'); 
} 

</script> 
<div id="msgbox_actions"><input onclick="quoteme()" type="button" value="Request quote/sample" /> <a class="backtoproducts" href="http://www.dtrmedical.com/products" style="border-bottom-left-radius:5px 5px;border-bottom-right-radius:5px 5px;border-bottom-style:none;border-color:initial;border-left-style:none;border-right-style:none;border-top-left-radius:5px 5px;border-top-right-radius:5px 5px;border-top-style:none;border-width:initial;color:white;font-family:Arial;padding-bottom:2px;padding-left:6px;padding-right:6px;padding-top:2px;font-size:11px;">Back to products</a></div><!-- <input type="submit" value="Update" /> --><!-- <input onclick="jQuery.facebox({ ajax: 'wishlist.php?emailme=true' })" type="button" value="Save list for later" /> --> <!-- <input type="submit" value="Update Qty's" /> <input onclick="jQuery.facebox({ ajax: 'wishlist.php?basket=true&clearall=true' })" type="button" value="Clear list" /> --></div> 
</form> 

В строке, начиная с <div id="msgbox_actions">, в конце его после комментариев, является дополнительным </div>

Это нарушает ваш HTML, который IE не знает, как исправить, но другие браузеры могут.

Answer 2

Вероятно, не проблема, но моя FireBug консоль говорит мне об этом, когда я нажимаю на кнопку:

«NetworkError: 404 Не найдено - http://dtrmedical.com/xfade2.css»

Он не находит файл CSS для некоторых той или иной причине.

Answer 3

Ваше сообщение onclick не соответствует действительности вашей корзине div. Я не уверен, почему именно; IE8 может быть ошибкой в ​​правильном анализе сложных HTML-атрибутов.

Вместо того, чтобы определять событие inline (прямо внутри тега HTML), попробуйте сделать это через jQuery. Добавьте следующий код в начало вашего тела $.ready.

$('#mybasket').click(function(){location.href='wishlist.php?basket=true';}); 

В качестве примечания, вы всегда должны избегать определения любого обработки событий в вашем HTML, вместо того, чтобы принимать подход я описываю выше. Это не только означает, что все ваши «действия» будут находиться в одном месте, но также обеспечивают большую поддержку кросс-браузера (особенно если вы используете библиотеку jQuery).