保留jquery选项值，保存用户值

Question

我正在尝试实现一些非常小的目标。我会尽力解释的。

我有一个选项表单，其中包含多个选择、年、月和日期。每当用户选择某些东西时，都会提交表单，以便我可以从数据库中获取数据。

<form role="form" action="" method="post">
<select class="form-control" id="day" name="day" onchange="this.form.submit()">
       <option>- Dummy option -</option>
       <option>- Dummy option -</option>
       <option>- Dummy option -</option>
       <option>- Dummy option -</option>
</select>
</form>

一个代表日、月和年。

元素的 ID 是 "day", "month", "year"。

我试图默认显示今天的日期，它会自动获取今天的信息。

由于我对 JS/JQ 比较陌生，因此我尝试将选项设置为今天的日期：

var fYear = CurrentDate.getFullYear();
var fMonth = CurrentDate.getMonth()+1;
var fDay = CurrentDate.getDate();

$("#year").val(fYear);
$("#month").val(fMonth);
$("#day").val(fDay);

问题在于，每当用户选择一个选项时，它都会不断重新附加今天的日期，从而覆盖用户的选择。

-- 问题--

当用户没有对选择表单执行任何操作时，我将如何只显示今天的日期？仅当用户未更改表单时才显示日期。

谢谢。

Answer 1

我相信您可能想要使用jQuery.ajax，它可以让您在不刷新页面的情况下提交表单。

假设您的页面名为 page.html，而您的 HTML 看起来类似于 -

<form id="myform" role="form" action="" method="post">
  <select class="form-control" id="day" name="day" onchange="this.form.submit()">
   <option>- Dummy option -</option>
   <option>- Dummy option -</option>
   <option>- Dummy option -</option>
   <option>- Dummy option -</option>
  </select>
</form>

你的 javascript 应该是这样的

$("#myform").submit(function(event){
  event.preventDefault();
  $.ajax({
    type: "post",
    url: "page.html",
    data: $(this).serialize(),
    success: function (result) {
      ..... do something with the result
    },
    error: function() {
      ..... report the error
    }
});

Answer 2

为什么不通过类选择器.date 重置页面加载时的所有日期字段，然后设置今天的日期。

HTML 代码：

<input class="dt" type="text" name="date"/>
<input class="dt" type="text" name="month"/>
<input class="dt" type="text" name="year"/>

JS 代码：

$('document').ready(function(){
    $(".dt").val(''); 
    $("#year").val(fYear);
    $("#month").val(fMonth);
    $("#day").val(fDay);
});

Answer 3

在您的 jQuery 代码中分配默认值之前，您可以检查下拉菜单是否具有选定的值。如果没有，那么您可以分配默认值。

if($('#year').val() == ''){
    $('#year').val('fYear');
}