Question

以下代码调用了in index.html

    <script src="js/jquery/jquery-1.8.2.min.js"></script>
    <script src="js/px.js" type="text/javascript" ></script>
    <script type="text/javascript">
        var newGame = new px1("black");
        new px1Generator(newGame);
    </script>

以下代码位于px.js

var px1 = function (color) {
   if (color == "white") {
        this.x = "100";
   } else if (color == "black") {
        this.x = "900";
   }};
var px1Generator= function (px1obj) {
    for (i = 0; i < 10; i++) {
        $("#mainGame").append("<div class='pawn white'></div>");
    }
    //for 10 object upon add onClickEvent
    $(".pawn.white").on("click", function (event, px1obj) {
       alert(px1obj.x)
    });
};

我想发送100或900的onclick功能，怎么做？用户点击divs时错误一致

Answer 1

这里有两个问题。首先，当您立即运行代码时，您会看到此错误：

未捕获的TypeError：px1不是构造函数

这是因为您尝试在函数存在之前实例化该函数。您需要先定义函数，或更改为使用显式函数定义。

其次，问题本身就是因为您已将px1obj重新定义为click事件处理程序中永远无法定义的参数。这会隐藏在范围范围内定义的px1obj。要解决此问题，只需从事件处理程序中删除该参数：

＆＃13;

var newGame = new px1("black");
new px1Generator(newGame);

function px1(color) {
  if (color == "white") {
    this.x = "100";
  } else if (color == "black") {
    this.x = "900";
  }
};

function px1Generator(px1obj) {
  for (i = 0; i < 10; i++) {
    $("#mainGame").append("<div class='pawn white'></div>");
  }
  //for 10 object upon add onClickEvent
  $(".pawn.white").on("click", function(e) {
    console.log(px1obj.x)
  });
};

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div class="pawn white">pawn white</div>

＆＃13;

Answer 2

您需要从点击回调函数签名中删除px1obj参数，因为您要覆盖它。

px1obj已存在于px1Generator函数范围内，并且您将在onclick回调范围内覆盖它。

＆＃13;

$(function() {
  function px1(color) {
     if (color == "white") {
          this.x = "100";
     } else if (color == "black") {
          this.x = "900";
     }};
  function px1Generator(px1obj) {
      for (i = 0; i < 10; i++) {
          $("#mainGame").append("<div class='pawn white'>a</div>");
      }
      //for 10 object upon add onClickEvent
      $(".pawn.white").on("click", function (event) {
         console.log(px1obj.x)
      });
  };

  var a = new px1("black");

  px1Generator(a);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="mainGame"></div>

＆＃13;

如何在jquery中的onclick中传递参数

2 个答案: