我可以'我不能让这个JFidddle代码在我的项目中工作

I can't get this JFidddle Code to work in my project

本文关键字：代码 JFidddle 我的 项目 工作 不能 我可以      更新时间：2023-09-26

我是JavaScript的新手，在编写代码时仍在学习。我想实现这个特定的JSFiddle代码(http://jsfiddle.net/MCzJ6/163/)在一个项目中，但它不起作用。任何帮助都将不胜感激。

<!doctype html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
</head>
<script type="text/javascript">
  ;(function($, window, document, undefined){
    $("#days").on("change", function(){
       var date = new Date($("#start_date").val()),
           days = parseInt($("#days").val(), 10);
        if(!isNaN(date.getTime())){
            date.setDate(date.getDate() + days);
            $("#end_date").val(date.toInputFormat());
        } else {
            alert("Invalid Date");  
        }
    });

    //From: http://stackoverflow.com/questions/3066586/get-string-in-yyyymmdd-format-from-js-date-object
    Date.prototype.toInputFormat = function() {
       var yyyy = this.getFullYear().toString();
       var mm = (this.getMonth()+1).toString(); // getMonth() is zero-based
       var dd  = this.getDate().toString();
       return yyyy + "-" + (mm[1]?mm:"0"+mm[0]) + "-" + (dd[1]?dd:"0"+dd[0]); // padding
    };
})(jQuery, this, document);</script>
<body>
    <input type="date" id="start_date" placeholder="Start Date"/>
<input type="number" id="days" min=0 placeholder="Days"/>
<input type="date" id="end_date" placeholder="End Date" readonly/></body>
</html>

    <!doctype html>
    <html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>

<script type="text/javascript">
      (function($, window, document, undefined){
        $("#days").on("change", function(){
           var date = new Date($("#start_date").val()),
               days = parseInt($("#days").val(), 10);
            if(!isNaN(date.getTime())){
                date.setDate(date.getDate() + days);
                $("#end_date").val(date.toInputFormat());
            } else {
                alert("Invalid Date");  
            }
        });

        //From: http://stackoverflow.com/questions/3066586/get-string-in-yyyymmdd-format-from-js-date-object
        Date.prototype.toInputFormat = function() {
           var yyyy = this.getFullYear().toString();
           var mm = (this.getMonth()+1).toString(); // getMonth() is zero-based
           var dd  = this.getDate().toString();
           return yyyy + "-" + (mm[1]?mm:"0"+mm[0]) + "-" + (dd[1]?dd:"0"+dd[0]); // padding
        };
    })(jQuery, this, document);
</script>


    </head>
    <body>
        <input type="date" id="start_date" placeholder="Start Date"/>
    <input type="number" id="days" min=0 placeholder="Days"/>
    <input type="date" id="end_date" placeholder="End Date" readonly/></body>
    </html>

脚本应该在正文或头部分。此外，在脚本的开头和函数之前还有一个分号，它导致了该异常。看到这个，它应该可以正常工作。

您有一些语法错误。请仔细研究这个工作代码，看看你在哪里。你很接近。尝试第一个应用程序很好！

一个好的问题标题是，例如，当试图让日期计算器工作时出现语法错误，或者类似的事情。

还要注意我是如何在Stack Overflow中放置一个"fiddle"（称为片段）的。你也可以在问题中这样做。

$("#days").on("change", function() {
  var date = new Date($("#start_date").val()),
    days = parseInt($("#days").val(), 10);
  if (!isNaN(date.getTime())) {
    date.setDate(date.getDate() + days);
    $("#end_date").val(date.toInputFormat());
  } else {
    alert("Invalid Date");
  }
});
//From: http://stackoverflow.com/questions/3066586/get-string-in-yyyymmdd-format-from-js-date-object
Date.prototype.toInputFormat = function() {
  var yyyy = this.getFullYear().toString();
  var mm = (this.getMonth() + 1).toString(); // getMonth() is zero-based
  var dd = this.getDate().toString();
  return yyyy + "-" + (mm[1] ? mm : "0" + mm[0]) + "-" + (dd[1] ? dd : "0" + dd[0]); // padding
};
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
  <input type="date" id="start_date" placeholder="Start Date" />
  <input type="number" id="days" min=0 placeholder="Days" />
  <input type="date" id="end_date" placeholder="End Date" readonly/>
</body>
</html>

相关文章：