javascript - 多个jquery或javascript和datepicker无法正常工作

我正在开发一个Web应用程序，其中在多种情况下我需要多个弹出窗口/警告消息。这是我需要警告消息或弹出窗口的三种情况。


  
  当用户导航到应用程序内的其他选项卡时，应显示一个弹出窗口
  当用户关闭标签或浏览器窗口时，应该显示一个弹出窗口
  当用户导航到浏览器中的其他选项卡或最小化浏览器时，第n分钟将显示警告消息，并且将自动将用户带到应用程序选项卡，并弹出弹出窗口确认会话超时
  


我正在使用下面的代码来做所有这一切

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="idle_timer.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>



<script language="JavaScript">
$.noConflict();
$(".header v, .drop v").click(function(){
       window.onbeforeunload = null;
       return confirm("Are you sure you want to leave this page?");
});

</script>

<script language="javascript" type="text/javascript">
$.noConflict();
$(window).on('mouseover', (function () {
           window.onbeforeunload = null;
       }));
       $(window).on('mouseout', (function () {
           window.onbeforeunload = ConfirmLeave;
       }));
       function ConfirmLeave() {
           return "";
       }
       var prevKey="";
       $(document).keydown(function (e) {
                     if(window.onbeforeunload != null)
                           {
           if (e.key=="F5") {
               window.onbeforeunload = ConfirmLeave;
           }
           else if (e.key.toUpperCase() == "W" &amp; prevKey == "CONTROL") {
              if(y!=1)
               window.onbeforeunload = ConfirmLeave;
           }
           else if (e.key.toUpperCase() == "R" &amp; prevKey == "CONTROL") {
               window.onbeforeunload = ConfirmLeave;
           }
           else if (e.key.toUpperCase() == "F4" &amp; (prevKey == "ALT" || prevKey == "CONTROL")) {
               window.onbeforeunload = ConfirmLeave;
           }
           prevKey = e.key.toUpperCase();
                           }
       });</script>

<script>
$.noConflict();
var IDLE_TIMEOUT = 10; //seconds
var _localStorageKey = 'global_countdown_last_reset_timestamp';
var _idleSecondsTimer = null;
var _lastResetTimeStamp = (new Date()).getTime();
var _localStorage = null;
var url      = window.location.href;
AttachEvent(document, 'click', ResetTime);
AttachEvent(document, 'mousemove', ResetTime);
AttachEvent(document, 'keypress', ResetTime);
AttachEvent(window, 'load', ResetTime);

try {
    _localStorage = window.localStorage;
}
catch (ex) {
}

_idleSecondsTimer = window.setInterval(CheckIdleTime, 1000);

function GetLastResetTimeStamp() {
    var lastResetTimeStamp = 0;
    if (_localStorage) {
        lastResetTimeStamp = parseInt(_localStorage[_localStorageKey], 10);
        if (isNaN(lastResetTimeStamp) || lastResetTimeStamp &lt; 0)
            lastResetTimeStamp = (new Date()).getTime();
    } else {
        lastResetTimeStamp = _lastResetTimeStamp;
    }

    return lastResetTimeStamp;
}

function SetLastResetTimeStamp(timeStamp) {
    if (_localStorage) {
        _localStorage[_localStorageKey] = timeStamp;
    } else {
        _lastResetTimeStamp = timeStamp;
    }
}

function ResetTime() {
    SetLastResetTimeStamp((new Date()).getTime());
}

function AttachEvent(element, eventName, eventHandler) {
    if (element.addEventListener) {
        element.addEventListener(eventName, eventHandler, false);
        return true;
    } else if (element.attachEvent) {
        element.attachEvent('on' + eventName, eventHandler);
        return true;
    } else {
        //nothing to do, browser too old or non standard anyway
        return false;
    }
}

function WriteProgress(msg) {
    var oPanel = document.getElementById("SecondsUntilExpire");
    if (oPanel)
         oPanel.innerHTML = msg;
    else if (console)
        console.log(msg);
}

function CheckIdleTime() {
    var currentTimeStamp = (new Date()).getTime();
    var lastResetTimeStamp = GetLastResetTimeStamp();
    var secondsDiff = Math.floor((currentTimeStamp - lastResetTimeStamp) / 1000);
    if (secondsDiff &lt; 1) {
        ResetTime();
        secondsDiff = 0;
    }
    WriteProgress((IDLE_TIMEOUT - secondsDiff) + "");
    if (secondsDiff &gt; IDLE_TIMEOUT-6) {
//             window.clearInterval(_idleSecondsTimer);
        var r=alert("Your session expires in 5 minutes \nPlease click \'OK\' to extend your session");

        if (r==true)
              {document.location.href = window.location.href;}

        ResetTime();
        //document.location.href = "logout.html";
    }
}
</script>

所有这些pop = ups都可以正常工作，但是问题是我在同一页面上使用datepicker.js，如果使用这些脚本，则无法使用datepicker或datewidget。早些时候，日期选择器表现得很好。我不明白为什么这些脚本会引起问题。
我可以使用任何其他脚本或其他可以与这些脚本配合使用的日期选择器吗？

最佳答案

我所看到的是，您没有包括jQuery用户界面库，而是另一种版本的jQuery库：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">
</script>

我想您在自定义代码之前需要此添加库：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript">
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js">
</script>

<script src="idle_timer.js" type="text/javascript"></script>