尝试使用带有 jquery 的单选按钮来控制搜索输入答案

【问题标题】：Trying to use radio buttons with jquery to control the search input尝试使用带有 jquery 的单选按钮来控制搜索输入
【发布时间】：2014-02-08 01:17:50
【问题描述】：

我有一个需要搜索的 WordPress 网站。它不是世界上最伟大的搜索引擎，所以我尝试使用如下单选按钮让它变得更好：

小提琴：http://jsfiddle.net/usMg6/3/

<form method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
<div id="search-inputs">
<input type="text" value="" name="s" id="s" />
<input class="search-all-words" type="radio" name="search-radio" value="AllWords">All Words <input class="search-exact-phrase" type="radio" name="search-radio" value="ExactPhrase">Exact Phrase
<input type="submit" id="searchsubmit" value="Search" />
</div>
</form>

如您所见，我添加了一组 2 个单选按钮。一个用于精确短语，一个用于所有单词。

您还可以看到，如果单击“确切短语”单选按钮，我已经设法获得在搜索框中的单词周围添加引号的部分。但是我有一个问题是我对 jQuery 的了解不够，无法使其其余部分正常工作。

所以我需要的是：

1) 为确保是否多次单击“确切短语”单选按钮，它只会在短语周围添加一组引号

2) 使控制“所有单词”的单选按钮在单词之间的所有空格之间添加 AND，如果在单击“所有单词”按钮后单击“确切短语”单选按钮并且“与” ' 已添加它删除单词 'AND' 并在短语周围添加引号。

希望一切都有意义！非常感谢任何帮助。

【问题讨论】：

标签： javascript jquery wordpress search radio

【解决方案1】：

代码：

    $( ".search-exact-phrase" ).click(function() {
        var searchInputStr = $("input#s").val();
     if( searchInputStr.indexOf('"')==-1) {
        $("input#s").val('\"' + searchInputStr + '\"');
     }
    if(searchInputStr.indexOf('AND') && searchInputStr.indexOf('"')==-1) {
        new_text= searchInputStr.replace(/ AND /g,' ');
   $("input#s").val('"'+new_text+'"');
     }
    });
$( ".search-all-words" ).click(function() {
        var searchInputStrAll = $("input#s").val();

    if(searchInputStrAll.indexOf('"')) {
       $("input#s").val( searchInputStrAll.replace(/\"/g,''));
    }
      if( searchInputStrAll.indexOf('AND')==-1)
          $("input#s").val( searchInputStrAll.split(' ').join(' AND ').replace(/\"/g,''));
    });

链接：http://jsfiddle.net/usMg6/30/

【讨论】：

【解决方案2】：

我已经更新了你的小提琴http://jsfiddle.net/eY9RH/。

 $( ".search-exact-phrase" ).click(function() {
        var searchInputStr = $("input#s").val().replace(/['"]/g,'');
        searchInputStr = searchInputStr.split(' AND ').join(' ')
        $("input#s").val('\"' + searchInputStr + '\"');
    });
$( ".search-all-words" ).click(function() {;
        var searchInputStrAll = $("input#s").val().replace(/['"]/g,'');
        searchInputStrAll = searchInputStrAll.replace(/\s+$/, '');
        $("input#s").val(searchInputStrAll.split(' ').join(' AND '));
    });

希望这会对你有所帮助。

【讨论】：