Question

我在head标签中创建了一个名为toggleColor的javascript函数。有了这个，我想在点击时将表格颜色更改为红色。在我的td标签内的主要代码的底部，我添加了click for my function，但由于某种原因，这不起作用。当我在点击内点硬编码和提醒功能点击某一行时它会打开警报，但是当我甚至尝试在我的td标签内通过将颜色更改为红色进行硬编码时，它仍然无法正常工作，这非常令人困惑。我已经为此考虑了一些资源，我已经完成了它们设置的方式，但仍然没有运气。真的很感激一些帮助。

主要代码：

<?php print( '<?xml version = "1.0" encoding = "utf-8"?>') ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>User selection page</title>
        <link rel="stylesheet" href="gameViewStyleSheet.css" type="text/css" />

    <script type="text/javascript">
      function toggleColor(this)
      {
        this.style.backgroundColor='red';
      }
    </script>
  </head>


    <?php
        /*
        Version 1.1: Instead of printing the teams in different cells we are going to print the 
        games in one row and we select the game itself to see if an upset will occur. This version 
        provides this functionality with a table for each conference. Currently Data is still hard-
        coded and each table prints the west conference data. We will pull data from the DB once it 
        is set up. That will be provided in the next version.
        */  

        require_once('Conference.php'); 

        for ($j = 0; $j<4; $j++)
        {       
            $loadGameClass = new Conference();
            $loadGameClass->loadTeams(array("(1)Gonzaga vs (16)Southern U", "(8)Pittsburgh vs (9)Wichita St", "(5)Wisconsin vs (12)Ole Miss", "(4)Kansas st vs (13)Boise St", "(6)Arizona vs (11)Belmont", "(3)New Mexico vs (14) Harvard", "(7)Notre Dame vs (10)Iowa St", "(2)Ohio St vs (15) Iona"));
            $teams = $loadGameClass->getTeams();

            echo '<table border="1" align="center">';

            switch ($j) {
                case 0:
                    echo "Midwest";
                    break;
                case 1:
                    echo "West";
                    break;
                case 2:
                    echo "South";
                    break;
                case 3:
                    echo "East";
                    break;  
                }

            //echo '<div class = ".table_entries">';

            for ($i = 0; $i < 8; $i++) 
            {
                $games = $teams[$i];
                echo '<tr><td onclick="toggleColor(this)">'.$games.'</td><tr>';
            }

            echo '</table>';
            echo "<br>" . "<br>";

            //echo '</div>';

        }
    ?>

    <body>
    </body>
</html>

会议：

<?php

class Conference
{
    protected $teams;

    function loadTeams($teams)
    {
        $this->teams = $teams;
    }

    function getTeams()
    {
        return $this->teams;
    }
}

?>

Answer 1

您不能拥有名为this的参数，因为this在Javascript中具有特殊含义。

更改以下功能：

function toggleColor(this)
{
    this.style.backgroundColor='red';
}

要：

function toggleColor(el)
{
    el.style.backgroundColor='red';
}

<强>更新：

function toggleColor(el)
{
    var s = el.style;
    s.backgroundColor = (s.backgroundColor === 'red' ? 'white' : 'red');
}

Answer 2

这是一个保留字

的onclick = “toggleColor.call（这）”;

function toggleColor()
{
this.style.backgroundColor='red';
}

警报事件工作但我的点击更改颜色的JavaScript函数不起作用

2 个答案: