多个jquery或javascript和日期选择器不起作用

Multiple jquery or javascripts and datepicker not working

本文关键字:日期 选择器 不起作用 javascript jquery 多个      更新时间:2023-09-26

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

  1. 当用户导航到应用程序内的其他选项卡时,应显示弹出窗口
  2. 当用户关闭选项卡或浏览器窗口时,应显示弹出窗口
  3. 当用户导航到浏览器中的其他选项卡或用户最小化浏览器时,将在第 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都工作正常,但问题是我在同一页面上使用日期选择器.js如果我使用这些脚本,我无法使用日期选择器或日期小部件。早些时候,日期选择器表现完美。我不知道为什么这些脚本会导致问题。是否有任何其他脚本可供我使用,或任何其他日期选择器可以很好地与这些脚本配合使用?

我可以看到你没有包含jquery upi库,而是另一个版本的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>
<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 src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="idle_timer.js" type="text/javascript"></script>