我想在第一次点击时在单元格内放置一个图像,在第二次点击时在同一位置放置另一个图像。为了做到这一点,我尝试在标签中编写onclick函数..但由于它在函数内写入它不会工作..有没有其他方法来实现需要?请帮助?
用于放置图像的JS: -
function changeColor1(elem)
{
elem.innerHTML = '<img src="images/atom1.png" width="20px" height="20px" onclick=changecolor2(this) />';
//alert("Row Index is:"+elem.parentNode.rowIndex+elem.cellIndex);
var x= elem.cellIndex;
var y= elem.parentNode.rowIndex;
click_count(x,y);
}
function changeColor2(elem)
{
elem.innerHTML = '<img src="images/2circles.png" width="20px" height="20px" onclick=changecolor3(this) />';
//alert("Row Index is:"+elem.parentNode.rowIndex+elem.cellIndex);
var x= elem.cellIndex;
var y= elem.parentNode.rowIndex;
click_count(x,y);
}
制作网格的代码:
$rows = 7; // define number of rows
$cols = 6;// define number of columns
echo "<center>";
echo "<table border='1' cellspacing=0 cellpadding='35' pixels'>";
for($tr=0;$tr<$rows;$tr++){
echo "<tr>";
for($td=0;$td<$cols;$td++){
echo "<td onclick=\"changeColor1(this)\" >   </td>";
}
echo "</tr>";
答案 0 :(得分:1)
试试这个:
function hasClass(element, cls) {
return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') > -1;
}
function changeColor2(elem)
{
if(!hasClass(elem, 'clicked')){
//clicked first time
elem.className = elem.className + " clicked";//add clicked class to element on first click
elem.innerHTML = '<img src="images/2circles.png" width="20px" height="20px" onclick=changecolor3(this) />';
//alert("Row Index is:"+elem.parentNode.rowIndex+elem.cellIndex);
var x= elem.cellIndex;
var y= elem.parentNode.rowIndex;
click_count(x,y);}
else{
//clicked second time and onward
}
}