- 爱易网页
-
JavaSript
- JS控制DIV显示后隐藏有关问题(具体内详)
日期:2014-05-16 浏览次数:20326 次
JS控制DIV显示后隐藏问题(具体内详)
我在界面上有一个DIV来装数据,先影藏起来,当一个文本框获(Text)取焦点的时候在DIV里面动态添加一个Table,每个TR有一个onclick="RowClick(this)" 事件,onclick事件是用来获取点击行的数据然后赋给文本框(Text),文本框还有个事件是onblur,当文本框获取值之后隐藏DIV,这时先执行的是文本框的onblur事件,而没有执行TR上面的onclick事件。我需要点击table时执行的是TR上的onclick事件,各位大神,怎么实现呢?
<script type="text/javascript">
// 创建一个去掉前后空格的公共方法
String.prototype.trim = function () {
return this.replace(/^\s+|\s+$/g, "");
};
$(function () {
$("#txtFromCity").keyup(function () {
document.getElementById("selectFromCity").innerHTML = "";
$("#selectFromCity").attr("style", "display:block;");
var CityAbbreviated = $("#hideCityAbbreviated").val().trim();
var txtFromCity = $("#txtFromCity").val().trim();
var reg = /[^a-zA-Z\u4e00-\u9fa5]+/gi;
var reg1 = /[a-zA-Z]+/gi;
if (reg.test(txtFromCity) == true) {
document.getElementById("lblFromCity").innerHTML = "请输入正确的城市名称!";
return;
}
else {
$("#selectFromCity").append('<table id="tbFromCity" style="background-color:#60C3EC">');
if (reg1.test(txtFromCity) == true) {
var str = CityAbbreviated.split(',');
for (var i = 0; i < str.length; i++) {
if (txtFromCity.length == "1") {
if (txtFromCity.toUpperCase() == str[i].substring(0, 1) || txtFromCity.toUpperCase() == str[i].substring(str[i].length - 3, str[i].length - 2)) {
$("#selectFromCity").append('<tr onclick="RowClick(this)" class="tr"><td>' + str[i] + '</td></tr>');
}
}
}
});
});
// TR的行点击事件
var currentRow = null;
function RowClick(row) {
if (currentRow != null) {
currentRow.style.removeAttribute("backgroundColor");
}
currentRow = row;
currentRow.style.backgroundColor = "#60C3EC";
var fromCity = currentRow.cells[0].innerHTML;
var str = fromCity.trim().split('-');
$("#txtFromCity").val(str[1]);
$("#selectFromCity").attr("style", "display:none;");
}
function HideDiv() {
$("#selectFromCity").attr("style", "display:none;");
}
</script>
<table>
<tr>
<td>
出发城市:
</td>
<td>
<input id="txtFromCity" onblur="HideDiv()" /><label id="lblFromCity"></label>
<div id="selectFromCity">
</div>
</td>
</table>
------解决方案--------------------