JavaScript OnClick无法在iOS上运行

时间:2014-08-28 13:35:55

标签: javascript ios browser onclick touchstart

我开发了一些代码,用于检测用户何时点击表格中的单元格,然后使用为该单元格设置的bgColor。

所有在台式电脑上工作正常,但当我尝试使用我的iPad时,它什么都不做。我曾尝试使用touchstart,但这没有任何区别。

我尝试改变这个: -

 t[i].onclick = getVal;  

到此: -

t[i].addEventListener('touchstart', function(){getVal});

但是这没有用......我还需要同时支持桌面设备和触控设备......所以不确定我是如何确保在这种情况下同时支持这两种设备的。

我目前的代码如下: -

<script type="text/javascript">

function getVal(e) {
    var targ;
    if (!e) var e = window.event;
    if (e.target) targ = e.target;
    else if (e.srcElement) targ = e.srcElement;
    if (targ.nodeType == 3) // defeat Safari bug
        targ = targ.parentNode;

    var colorSelected = targ.attributes.bgcolor.value;
    alert(colorSelected);
}
onload = function() 
{
    var ids = ['colorchart1', 'colorchart2', 'colorchart3', 'colorchart4', 'colorchart5'];
    for(var j = 0; j < ids.length; j++) 
    {
        var t = document.getElementById(ids[j]).getElementsByTagName("td");
        for ( var i = 0; i < t.length; i++ )
            t[i].onclick = getVal; 
    }
}

</script>



<table id="colorchart1">
<tr>
<td bgColor="#F8E0E0"></td><td bgColor="#F8ECE0"></td><td bgColor="#F7F8E0"></td><td   bgColor="#ECF8E0"></td>
<td bgColor="#E0F8E0"></td><td bgColor="#E0F8EC"></td><td bgColor="#E0F8F7"></td><td bgColor="#E0ECF8"></td><td bgColor="#E0E0F8"></td>
</tr><tr>
<td bgColor="#F5A9A9"></td><td bgColor="#F5D0A9"></td><td bgColor="#F2F5A9"></td><td bgColor="#D0F5A9"></td>
<td bgColor="#A9F5A9"></td><td bgColor="#A9F5D0"></td><td bgColor="#A9F5F2"></td><td bgColor="#A9D0F5"></td><td bgColor="#A9A9F5"></td>
</tr>
<table>

1 个答案:

答案 0 :(得分:1)

这个句柄函数怎么样?

function handler(e){
 e.target.nodeName!='TD'||alert(e.target.bgColor+' on '+
 e.target.parentNode.parentNode.parentNode.id);
}
window.addEventListener('click',handler,false);

or 

window.addEventListener('touchstart',handler,false);

演示

http://jsfiddle.net/gfmbkmmn/

有多个表

http://jsfiddle.net/gfmbkmmn/1/

上述函数是使用一个事件处理程序处理多个表的替代解决方案。要找到您的错误,需要更多信息:

注意:在ios中写window.onload更好,以及当前代码&#34;中的script标记怎么样?getVal函数是什么?

如果您对代码有任何疑问,请询问

修改

function getVal(e){
 e=e||window.event;//not needed
 e.target=e.target||e.srcElement;//not needed
 if(e.target.nodeName=='TD'){// check if it's a td
  alert(e.target.bgColor);// why write  'targ.attributes.bgcolor.value' ?
 }
}

节点错误发生在7年前&#34; 7年前改变了...&#34;  http://bugs.jquery.com/ticket/1148

js区分大小写:bgcolor != bgColor

http://jsfiddle.net/gfmbkmmn/2/这个基本示例允许您创建快速调色板。