0

我想替换这个：

<body onload="
      $('input[name=startDate]').focus();
      $(function () { 
        $('#startDate').datepicker({ dateFormat: 'mm/dd/yy'});
      });
 ">

使用内联 javascript - 类似于：

<script th:inline="javascript">
/*<![CDATA[*/
    $( document ).ready(function() {
        $('input[name=startDate]').focus();
        $('#startDate').datepicker({ dateFormat: 'mm/dd/yy' });
    });
/*]]>*/
</script>

但是，这不起作用。错误是：ReferenceError: $ is not defined

任何人都知道如何让它工作？

4

3 回答 3

2

感谢上面的提示，我能够解决这个问题，如下所示：

添加适当的依赖项：

<dependency>
        <groupId>org.webjars</groupId>
        <artifactId>jquery</artifactId>
        <version>2.2.4</version>
        <scope>compile</scope>
</dependency>

添加配置挂钩：

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

@Configuration
public class WebConfig extends WebMvcConfigurerAdapter {

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        if (!registry.hasMappingForPattern("/webjars/**")) {
            registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");
        }
    }
}

最后，正确导入脚本：

<script th:src="@{/webjars/jquery/2.2.4/jquery.min.js}"></script>

然后在内联 javascript 中正确调用 jQuery 就绪函数。

于 2016-07-26T10:20:11.680 回答
2

你有没有这样做：

你的控制器类：

@Grab("org.webjars:jquery:2.1.1")
@Grab("thymeleaf-spring4")
@Controller
class MyApp{...}

你的 html (tymeleaf)

    <head>
          <title>blablabla</title>
          <script src="webjars/jquery/2.1.1/jquery.min.js"></script>

 <script th:inline="javascript">
/*<![CDATA[*/
    $( document ).ready(function() {
        $('input[name=startDate]').focus();
        $('#startDate').datepicker({ dateFormat: 'mm/dd/yy' });
    });
/*]]>*/
</script>
            </head>
于 2016-07-26T09:29:07.280 回答
1

请加：

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

在你的脚本块之前。

$是 jQuery 的一部分。您需要添加它的库/实现文件才能使用它。

于 2016-07-26T09:28:36.873 回答