保留jquery选项的值，保存用户的值 - Keep jquery option value, save user's value

Keep jquery option value, save user's value

本文关键字：保存用户 jquery 保留选项 | 更新日期: 2023-09-27

我正在努力实现一些相当小的东西。我会尽力解释的。

我有一个选项表单与多个选择，年，月和日期。每当用户选择某项内容时，就会提交表单，以便我可以从数据库中获取数据。

<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);

问题是无论何时用户选择一个选项，它都会重新添加今天的日期，覆盖用户的选择。

—问题—

当用户没有对select表单做任何操作时，我该如何只显示今天的日期呢?只有在用户未更改表单时才显示日期。

谢谢。

我相信您可能想使用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
    }
});

在你的jQuery代码中分配默认值之前，你可以检查下拉列表是否有一个选择值。如果没有，则可以指定默认值。

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

为什么不通过类选择器.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);
});