私はかなり ajax を多用するページに取り組んでいます。すべての ajax フォームはブラウザー間で正常に動作しているように見えますが、ページの最後の 1 つのステップが IE8 以下で壊れています。
問題を示すデモ ページを次に示します: http://jolora.com/~fwm/
問題を再現するには、最終フォーム (電子メール名など) を入力してください。マップ上にマーカーのリストが表示されます。「Request Appointment」ボタンは ajax 関数を起動するはずですが、実際には IE7 と IE8 でフォームを送信するため、preventDefault が機能していないように見えます。
関連するjQueryは次のとおりです。
// Request appointment
$('#map').on('submit', 'form', function(event) {
event.preventDefault();
var solicitorID = $(this).attr('id');
solicitorRequest(solicitorID,applicationID);
});
function solicitorRequest(requestedSolicitor,currentApplication) {
$.ajax({
url: siteurl + 'wp-admin/admin-ajax.php',
data:{
'action':'do_ajax',
'fn':'request_solicitor',
'solicitor': requestedSolicitor,
'application': currentApplication
},
dataType: 'JSON',
success:function(data){
alert('Please check your email - this success function needs improving');
},
error: function(errorThrown){
alert('error');
//console.log(errorThrown);
}
});
}
ポップアップは、Leaflet の bindPopup メソッドhttp://leafletjs.com/reference.html#popupを使用して構築されます。ポップアップに挿入するコンテンツの構造は次のとおりです。
var popupContentBegin = '<form id="'
+ solicitor.id + '">'
+ '<h3>' + solicitor.name + '</h3>'
+ '<div class="contact-details">'
+ '<span class="addr">' + solicitor.address + '</span>';
var popupContentTel = '';
if(solicitor.telephone != false) {
popupContentTel = '<span class="tel">'
+ solicitor.telephone
+ '</span>';
}
var popupContentEnd = '</div>'
+ '<button type="submit">Request appointment</button>'
+ '</form>';
var popupContent = popupContentBegin + popupContentTel + popupContentEnd;
var marker = L.marker([lat, lng], {icon: solicitorIcon}).bindPopup(popupContent, popupOptions);
どんな助けでも大歓迎です!ありがとう。