gpt4 book ai didi

java - JQuery 日期选择器未显示在 JSP 中

转载 作者:行者123 更新时间:2023-12-01 05:39:00 25 4
gpt4 key购买 nike

我正在使用 Struts2 开发一个 web 应用程序,并且创建了一个带有日期选择器的 jsp。但是当我加载页面时,什么也没有发生。该插件似乎工作正常并生成日期选择器 ui-datepicker-div

<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>

但是当我聚焦#date时文本输入没有任何反应。非常奇怪的是,我用简单的 HTML 来设计我的 jsps,并且日期选择器可以工作。

这是该页面的源代码。

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html>
<html class=" js csstransforms3d">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title><s:text name="application.title" /> | <s:property value="section.description" /> </title>
<link href="<s:url value="/assets/css/styles.css"/>" rel="stylesheet" type="text/css">

<link rel="shortcut icon" type="image/x-icon" href="<s:url value="/assets/img/favicon.ico" />" />
<script type="text/javascript" src="<s:url value="/assets/js/vendors/modernizr/modernizr.custom.js"/>"></script>
</head>
<body>

<!--Smooth Scroll-->
<div class="smooth-overflow">
<!--Navigation-->
<s:include value="/views/sections/menu.jsp" />
<!--/Navigation-->

<!--MainWrapper-->
<div class="main-wrap">
<!--Main Menu-->
<s:include value="/views/sections/sidebar_left.jsp" />
<!--/MainMenu-->

<!--Content Wrapper-->
<div class="content-wrapper">

<div class="page-header">
<h1><s:property value="section.description" /></h1>
</div>

<!-- Widget Row Start grid -->
<div class="row" id="powerwidgets">
<div class="col-md-12 bootstrap-grid">
<s:include value="/views/sections/pages/block_messages.jsp" />
</div>
</div>
<!-- /Widgets Row End Grid-->

<div class="powerwidget dark-blue powerwidget-sortable" id="date-range" data-widget-editbutton="false" role="widget" style="">
<header role="heading">
<h2>Date Pickers</h2>
<div class="inner-spacer" role="content">
<form action="" id="data-pickers" class="orb-form">
<fieldset>
<section>
<label class="label">Select date</label>
<label class="input"> <i class="icon-append fa fa-calendar"></i>
<s:textfield name="date" id="date" cssClass="hasDatepicker">
</label>
</section>
</fieldset>
<footer>
<button type="submit" class="btn btn-default">submit</button>
</footer>
</form>
</div>
</div>
</div>
<!-- / Content Wrapper -->

</div>
<!--/MainWrapper-->
</div>
<!--/Smooth Scroll-->

<!-- scroll top -->
<s:include value="/views/sections/footer.jsp" />
<!-- /scroll top -->

<!--Scripts-->
<!--JQuery-->
<script type="text/javascript" src="<s:url value="assets/js/vendors/jquery/jquery.min.js" />"></script>
<script type="text/javascript" src="<s:url value="assets/js/vendors/jquery/jquery-dateFormat.min.js" />"></script>
<script type="text/javascript" src="<s:url value="assets/js/vendors/jquery/jquery-ui.min.js" />"></script>

<!--Forms-->
<script type="text/javascript" src="<s:url value="assets/js/vendors/forms/jquery.form.min.js" />"></script>
<script type="text/javascript" src="<s:url value="assets/js/vendors/forms/jquery.validate.min.js" />"></script>
<!--Bootstrap-->
<script type="text/javascript" src="<s:url value="assets/js/vendors/bootstrap/bootstrap.min.js" />"></script>

<!--Main App-->
<script type="text/javascript" src="<s:url value="assets/js/scripts.js" />"></script>

<s:include value="/views/sections/footer_scripts.jsp" />
<!--/Scripts-->

</body>

文件内scripts.js我已经初始化了日期选择器

$(document).ready(function() {
if ($('#date').length) {
$('#date').datepicker({
dateFormat: 'dd.mm.yy',
prevText: '<i class="fa fa-chevron-left"></i>',
nextText: '<i class="fa fa-chevron-right"></i>'
});
}
});

最佳答案

定义表单标签上方的所有 .js 文件。

关于java - JQuery 日期选择器未显示在 JSP 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32067164/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com