Question

我在点击它时试图获取div块的名称。但我在控制台中看到一个错误：

未捕获的TypeError：无法读取属性＆＃39; className＆＃39;未定义的。

代码是：

＆＃13;

    $(window).click(function(element) {
       alert(element.srcElement.className);
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="root">
            <div class="wrap_question_container">
                <fieldset class="new_question"><legend>Question</legend>
                    <p>
                        <label for="question_title">Title: </label>
                        <input type="text" placeholder="Question Title" name="question_title" required><br>
                    </p>
                    <div class="choice_add"></div>
                </fieldset>
            </div><br>
        </div>
        <input type="submit" value="Submit" name="submit_val">

＆＃13;

我该如何解决这个问题？

Answer 1

来自MDN

Event.srcElement是标准Event.target属性的专有别名。它特定于旧版本的Microsoft Internet Explorer。

所以将element.srcElement.className更改为element.target.className。您也可以使用this.className，因为jQuery将this设置为事件目标。

$(window).click(function(element) {
  alert(element.target.className);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="root">
  <div class="wrap_question_container">
    <fieldset class="new_question">
      <legend>Question</legend>
      <p>
        <label for="question_title">Title:</label>
        <input type="text" placeholder="Question Title" name="question_title" required>
        <br>
      </p>
      <div class="choice_add"></div>
    </fieldset>
  </div>
  <br>
</div>
<input type="submit" value="Submit" name="submit_val">

BTW，使用名为element的变量来保存Event参数非常令人困惑。通常将其命名为event或e。

Answer 2

不是尝试使用类并在单击时获取类 - 使用HTML5的数据属性并单击div - 从数据属性中获取名称。当然，如果你根据类来设置div的样式 - 你需要保留它并添加数据属性，但这是获取有关被点击的div的信息的好方法。

$(document).ready(function(){
  $('.root div').click(function(){
    var name = $(this).attr('data-name');
    console.log(name);
    });
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="root">
            <div data-name="wrap_question_container">
                <fieldset class="new_question"><legend>Question</legend>
                    <p>
                        <label for="question_title">Title: </label>
                        <input type="text" placeholder="Question Title" name="question_title" required><br>
                    </p>
                    <div data-name="choice_add"></div>
                </fieldset>
            </div><br>
        </div>
        <input type="submit" value="Submit" name="submit_val">

未捕获的TypeError：无法读取属性＆＃39; className＆＃39;未定义的jquery

2 个答案: