1

$msg私はMacの初心者プログラマーであり(つまり、私はieを持っていません) 、データベースに格納されているものに基づいてフォーム要素(ボタン、選択/ドロップダウンなど)を表示する比較的単純なajaxjqueryアプリケーションを構築しました、または単にテキストとリンク)をクリックすると、データベースに戻ってを変更し$msgます。

私のコードはChromeとFirefoxでうまく機能しますが、フォーム要素(5秒遅れ)は、IEのすべてのバージョンでテストしたときにページを読み込んだときの状態に戻ります。イライラした後、SOの回答を調べて、Doctypeが問題になることがあることを読んだので、doctypeをhtml5 doctypeに変更しましたが、何も変更されていません。

これが私のコードです:

$(document).ready(function() {  



$('.checkIn').click(function() {
    var $e = $(this);
    var data = $e.data("param").split('_')[1] ;
    // gets the id  of button  (1 for the first button)
    // You can map this to the corresponding button in database...
    $.ajax({
        type: "POST",
        url: "checkin.php",
        // Data used to set the values in Database
        data: { "checkIn" : $(this).val(), "buttonId" : data},
        success: function() {
            // Hide the current Button clicked
            $e.hide();
            var $container = $e.closest("div.jcontainer");
            // Get the immediate form for the button
            // find the select inside it and show...

            $container.find('.locationSelect').fadeIn();
        }
    });
});
$('.reset').click(function() {
    var $e = $(this);
    var data = $e.data("param").split('_')[1] ;
    // gets the id  of button  (1 for the first button)
    // You can map this to the corresponding button in database...
    $.ajax({
        type: "POST",
        url: "reset.php",
        // Data used to set the values in Database
        data: { "reset" : $(this).val(), "buttonId" : data},
        success: function() {
            // Hide the current Button clicked
            $e.fadeOut();

            var $container = $e.closest("div.jcontainer");
            // Get the immediate form for the button
            // find the select inside it and show...
            $container.find('.finished').fadeOut();
            $container.find('.checkIn').fadeIn();
        }
    });
});
$('.locationSelect').change(function(e) {
  if($(this).children(":selected").val() === "CheckOut") {
    $e = $(this);
    var data = $e.data("param").split('_')[1] ;
    $.ajax({
        type: "POST",
        url: "checkout.php",
        // Data used to set the values in Database
        data: { "checkOut" : $(this).val(), "buttonId" : data},
        success: function() {
            // Hide the current Button clicked
            $e.fadeOut();
            var $container = $e.closest("div.jcontainer");
            // Get the immediate form for the button
            // find the select inside it and show...
            $container.find('reset').fadeIn();
            $container.find('.finished').fadeIn();

        }
    });
  }
  else{
    $e = $(this);
    var data = $e.data("param").split('_')[1] ;
    // gets the id  of select (1 for the first select)
    // You can map this to the corresponding select in database...
    $.ajax({
        type: "POST",
        url: "changeloc.php",
        data: { "locationSelect" : $(this).val(), "selectid" : data},
        success: function() {
            // Do something here
        }
    });
  }
});
setInterval(function(){

    $('.jcontainer').each(function() {
        var $e = $(this);
        var dataid = $e.data("param").split('_')[1] ;
        $.ajax({
            url: 'heartbeat.php',
            method: 'POST',
            contentType: "application/json",
            cache: true,
            data: { "dataid": dataid },
            success: function(data){


                var msg = $.parseJSON(data);

                if (msg == ""){ //after reset or after new patient that is untouched is added, show checkin
                    $e.find('.checkIn').show();
                    $e.find('.locationSelect').hide();
                    $e.find('.finished').hide();
                    $e.find('.reset').hide();
                }
                if ((msg < 999) && (msg > 0)){ // after hitting "Check In", Checkin button is hidden, and locationSelect is shown
                    $e.find('.checkIn').hide();
                    $e.find('.locationSelect').show();
                    $e.find('.finished').hide();
                    $e.find('.reset').hide();
                    $e.find('.locationSelect').val(msg);
                }
                if (msg == 1000){ //after hitting "Checkout", Option to reset is shown and "Finished!"
                    $e.find('.checkIn').hide();
                    $e.find('.locationSelect').hide();
                    $e.find('.finished').show();
                    $e.find('.reset').show();
                }


            }
       });


    });
  },5000);
});

私はできるだけ多くのコードにコメントしようとしましたが、基本的に最初の部分は$msg、フォーム要素との相互作用のタイプごとにphpページにアップロードするだけです(ボタンがクリックされ、オプションが選択され、リンクがクリックされます) 。次に、2番目の部分は5秒ごとの更新であり、現在コンピューター1に表示されているフォーム要素がコンピューター2に表示されていることを確認します(5秒の遅延あり)。

すべての助けに感謝します、そしてあなたがより多くの詳細/情報を必要とするならば、ただ尋ねてください!ありがとう!

4

1 に答える 1

2

発生している問題が100%わからないため、問題が発生している場合は申し訳ありませんが、IEがAjaxリクエストをキャッシュしている可能性があります。関数の前にこれを挿入してみてください。

$.ajaxSetup({
  cache: false
});

注:これが機能する場合は、最終的なコードをこのままにしないでください。すべてのブラウザーでAjaxキャッシュを無効にすることはお勧めできませんが、古いバージョンのIEでは無効にする必要がある場合があります。次のように、HTMLでIE条件付きコメントを利用することをお勧めします。

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie10 lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie10 lt-ie9 lt-ie8 ie7"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie10 lt-ie9 ie8"> <![endif]-->
<!--[if IE 9]>    <html class="no-js lt-ie10 ie9"> <![endif]-->
<!--[if gt IE 9]><!-->
<html class='no-js'>
  <!--<![endif]-->

次に、IEを検出すると、次の$.ajaxSetupようになります。

$.ajaxSetup({
  cache: !$('html').hasClass('lt-ie9'); //false if lower than IE9
});
于 2012-12-21T14:29:19.390 に答える