在 html 中搜索 javascript 无效

Question

我想在 tpl 文件

中显示站点 header 中的搜索


<div  class="search-widget" >

<form method="get" action="art/search">

<input type="text"  id="artnum" value="" maxlength="40" placeholder="" > 


<button type="submit"  onclick="TDMArtSearch()">
<i class="material-icons search">&#xE8B6;</i>
 <span class="hidden-xl-down"></span>
        </button>
</form>
<div class="tclear"></div>

<script type="text/javascript">

function TDMArtSearch(){
    var art = $('#artnum').val();
    if(art!=''){
        art = art.replace(/[^a-zA-Z0-9.-]+/g, '');
        location = '/art/search/'+art+'/';
    }
}
$('#artnum').keypress(function (e){
  if(e.which == 13){ TDMArtSearch(); return false;}
});
</script

        ></button>
    </form>
</div>

搜索无效。如果我删除form method="get" action="art/search"。然后搜索工作。仅当您单击搜索按钮时才有效。如何应用 form method 以使用回车键开始搜索

Answer 1

只需让表单在提交时执行 javascript 函数：

<div  class="search-widget" >

<form method="get" action="art/search" onsubmit="TDMArtSearch(); return false;">

<input type="text"  id="artnum" value="" maxlength="40" placeholder="" > 

<button type="submit"  onclick="TDMArtSearch()">
<i class="material-icons search">&#xE8B6;</i>
 <span class="hidden-xl-down"></span>
        </button>
</form>
<div class="tclear"></div>

<script type="text/javascript">

function TDMArtSearch(){
    var art = $('#artnum').val();
    if(art!=''){
        art = art.replace(/[^a-zA-Z0-9.-]+/g, '');
        location = '/art/search/'+art+'/';
    }
}
</script

        ></button>
    </form>
</div>

onsubmit属性是在表单提交时执行javascript，returnfalse是停止"normal"提交。有更好的方法可以通过添加侦听器和更简洁的 HTML 代码来做到这一点，但是一旦您知道它是如何工作的，您就可以寻找它。

在 html 中搜索 javascript 无效

Search for javascript in html does not work

html

javascript

php

smarty