当某些 CSS 类在输入字段上时，Javascript 将不会运行

Question

我还不太精通 CSS 或 JavaScript，需要一些帮助。我正在维护一个 jsp 页面，该页面有一个输入字段，该字段在某些搜索功能中充当参数。我添加了一个 JavaScript 函数，允许用户使用“onkeypress”事件按下回车键并触发搜索功能。输入字段包含三个 CSS 类。其中一个 CSS 类阻止调用 JavaScript 函数。我知道这一点是因为删除类允许 JavaScript 运行。一旦我把它放回去，JavaScript 就不会运行。

这里分别是 JavaScript、CSS 类 (.personSearch) 和输入字段。

function searchKeyPress(e) {
	if(typeof e == 'undefined' && window.event) {
		e = window.event; 
	}
	if(e.keyCode == 13){
		document.getElementById('searchButton').click();
	}
}

.personSearch {
    background-image: url(./../images/icons/personSearch.png);
    background-position:center right;
    background-repeat:no-repeat
}

<input class="fillWidth personSearch allowManualInput" 
    name="scrName" 
    id="personSearch-scr" 
    type="text" 
    onkeypress="searchKeyPress(event);"/>

正如我上面所说，当我从输入字段中实际删除 personSearch 类时，JavaScript 运行良好。但是，当我离开它时，JavaScript 不会触发。

感谢您的帮助!

Answer 1

它不起作用，因为在 HTML 代码中没有定义 id="searchButton"的元素。

<button id="searchButton" onclick="alert('here');">Click</button>

工作 fiddle :http://jsfiddle.net/m7qov85g/