javascript如果文本框元素为空,则执行不同的操作

时间:2014-01-14 20:39:52

标签: javascript forms search if-statement textbox

尝试让此搜索表单执行不同的搜索,但如果搜索框为空,我希望它默认为不同的页面。这是第一个if。即使文本框为空,它也会默认为第一个操作。

<script type="text/javascript">
    function changeAction() {   
      if(document.getElementById('searchOption').value == "title" && document.getElementById('searchText').value!=null) {
       document.getElementById('searchForm').action = 'catalog.com=0&term=' + escape(document.getElementById('searchText').value);
      }
      **else if(document.getElementById('searchOption').value == "title" && document.getElementById('searchText').value===null) {
       document.action = 'differentPage.com'
      }**
      else if(document.getElementById('searchOption').value == "keyword") {
        document.getElementById('searchForm').action = 'catalog.com?keyword=' + escape(document.getElementById('searchText').value);
      }
  else{
       document.getElementById('searchForm').action = "mysite.com/searchResults.html";
       $('#searchForm').attr('method', 'get');
       $('#searchText').attr('name', 'q');
       }
 }
</script>

<form id="searchForm" name=search method=post>
    <div class="subscribe">
        <div class="text">
            <input name="term" type="text" id="searchText"/>
        </div>
        <select id="searchOption" name="searchOption" title="search">
            <option name="index" value="title" selected="selected">TITLE IN CATALOG</option>
            <option name="index" value="keyword" type="hidden">CATALOG KEYWORD</option>
            <option name="nothing" value="googleSearch" type="hidden">LIBRARY WEBSITE</option>
        </select>
        <!-- for google search appliance -->
        <input value="slco_pub" name="client" type="hidden">
        <input value="slco_pub" name="proxystylesheet" type="hidden">
        <input value="xml_no_dtd" name="output" type="hidden">
        <input value="mainSite" name="site" type="hidden">
        <!-- end of necessary for google search appliance -->
        <!-- for ILS -->
        <INPUT name=menu value=search type=hidden>
        <INPUT name=aspect value=basic_search type=hidden>
        <INPUT name=profile value=maincentral type=hidden>
        <!-- Left from old <INPUT name=index value=".TW" type=hidden> -->
        <INPUT name=index value="PALLTI" type=hidden>
        <!-- end of necessary for google search appliance-->
    <!--Button Graphic-->
        <input type="image" src="/sebin/m/p/btn-search.gif" alt="search button" onClick="changeAction();" />
    </div>
</form>

1 个答案:

答案 0 :(得分:0)

document.getElementById('searchText').value!=null正在使用松散比较,因此如果值为nullundefined,则为真。在这种情况下,它将始终是一个字符串。你要测试的是它是否是一个非空字符串,如下所示:

var option = document.getElementById('searchOption').value,
    text = document.getElementById('searchText').value,
    form = document.getElementById('searchForm');

if (option === "title" && text.length > 0) {
    form.action = 'catalog.com=0&term=' + escape(text);
}
else if (option === "title" && text.length === 0) {
    form.action = 'differentPage.com'
}
else if (option === "keyword") {
    form.action = 'catalog.com?keyword=' + escape(text);
}
else {
    form.action = "mysite.com/searchResults.html";
    $('#searchForm').attr('method', 'get');
    $('#searchText').attr('name', 'q');
}

请注意,我使用了严格的比较。