Question

我正在开发一个网页，其中包含要显示的项目和子项目列表。在Div元素中，我正在设置值，图像。使用图像显示和隐藏选项单击事件处理程序触发。 IE9似乎运行良好，但不适用于其他浏览器（Fire Fox，Chrome＆amp; safari）。

<div id="Type_A Medicine" value="H" entity="Type A Medicine" onClick="showHide(this,'MIE_Type_A Medicine')"><img src='<%=request.getContextPath()%>/images/plus.gif'>Type A Medicine</div>

function showHide(ctrl,id)
{
    if (ctrl.value == "H")
    {
            ctrl.value = "S";
            ctrl.innerHTML = "<img src='<%=request.getContextPath()%>/images/minus.gif'>" +ctrl.getAttribute("entity");
            showBlock(id);
    }
    else if (ctrl.value == "S")
    {
        ctrl.value = "H";
        ctrl.innerHTML = "<img src='<%=request.getContextPath()%>/images/plus.gif'>" + ctrl.getAttribute("entity");
        hideBlock(id);
    }
}


function hideBlock(blockId)
{
    var str = "document.all." + blockId + ".style.display='none'";
    eval(str);
}

function showBlock(blockId)
{
    var str = "document.all." + blockId + ".style.display=''";
    eval(str);
}

我仍然无法弄清楚与浏览器列表的区别。总结帮助...

谢谢

Answer 1

我猜这是因为你使用了无效的ID语法。 ID不能有空格。如果您使用无效的HTML，则不能指望javascript在浏览器中以相同的方式工作。

id="Type_A Medicine"

此外，你永远不会发布showBlock或hideBlock的代码来传递ID。如果没有代码，不能告诉那里出了什么问题。

Answer 2

要检索非标准属性，您应该使用.getAttribute()而不是尝试将其作为属性进行访问。

因此ctrl.entity应为ctrl.getAttribute("entity")，其他非标准属性应相同。在Chrome中运行此示例：http://jsfiddle.net/jfriend00/Lxna7/。

此外，您应该从ID值中删除空格，因为它不是合法字符，并且在许多情况下（其中空格是标识符之间的分隔符）使ID无法使用。

Answer 3

尝试正确关闭图片代码，看看是否能解决问题：

<img src="path/file.html" />

图像使用事件处理程序隐藏和隐藏

3 个答案: