javascript - 尝试更改表单提交上我的提交输入的值

Question

我的页面中有一个帖子列表，还有一个用于搜索帖子的表单。

这是我的表格:

<form  action="" method="post">
  <input type="text" name="search"   onclick="if(this.value=='Search:')this.value=''" onblur="if(this.value=='')this.value='Search:'" value="Search:" />
  <input type="submit" value="Search" class="search"  name="sendForm" />
</form>

然后，当我的表单提交一些值时，我使用 sql 条件语句存储一个 session ，并且我只获得标题与我在输入中写入的值类似的新闻列表。

然后，如果我提交没有任何值的表单，我会取消设置我的 session ，并再次获得所有新闻的列表。

这是我的 php:

if(isset($_POST['sendForm'])){
    $search = $_POST['search'];
    if(!empty($search) && $search != 'Search:'){
    $_SESSION['where'] = "WHERE title LIKE '%$search%'";
    }
    else{
        unset($_SESSION['where']);
        header('Location: dashboard.php?exe=posts/index');
    }
 }

现在我需要在提交表单时更改输入金额的值。

首先，我的提交值为“搜索”，当我单击它时，我想将该值更改为“清除”。 当我点击“清除”时，我想再次更改为“搜索”。

你知道我怎样才能正确地做到这一点吗？

我一开始尝试这样做，但效果不佳:

<input type="submit" value="Search"  onclick="if(this.value=='Search:')this.value='Clear"  name="sendForm" />

现在我尝试使用toogle，但它也无法正常工作。

$(".search").toggle(function (){
           $(this).val("Search");
        }, function(){
        $(this).val("Clear");
});

Answer 1

Demo

1. toggle() - click 已弃用 - Reference ，当前 jQuery 的 toggle() 会隐藏该元素。

2. 如果需要，请使用 preventDefault() 来阻止表单提交。

检查此代码，

var clear = true;
$('.search').click(function(e){
    e.preventDefault();          //if required
    if(clear){
        $(this).val('Clear');
        clear = false;
    }
    else{
        clear = true;
        $(this).val('Search'); 
    }

});