Question

我需要能够获得目标的默认值。但是，它会返回undefined，即使它返回我编辑的文本内容。

表

<table class="data  table-bordered table table-striped" id="ui" method="POST">
  <tr style="background-color:blue;color:white;">
    <td width="25%">Device-imei</td>
    <td>Device-Model</td>
    <td>device-nickname</td>
  </tr>
  <tr>
    <td>"111111"</td>
    <td>"Model"</td>
    <td>
      <div class="device-name" contenteditable>"Name"</div>
    </td>
  </tr>
  <tr>
    <td>"11121341"</td>
    <td>"asdf"</td>
    <td>
      <div class="device-name" contenteditable>"Name"</div>
    </td>
  </tr>
</table>

的Javascript

$('.device-name').on('blur', function(event) {
  alert(event.target.defaultValue);
  alert(event.target.textContent);
});

EDIT 找到了解决我的代码的方法我将数据值添加到我的div中并使用getAttribute来获取我的数据 HTML

<table class="data  table-bordered table table-striped" id="ui" method="POST">
  <tr style="background-color:blue;color:white;">
    <td width="25%">Device-imei</td>
    <td>Device-Model</td>
    <td>device-nickname</td>
  </tr>
  <tr>
    <td>"111111"</td>
    <td>"Model"</td>
    <td>
      <div class="device-name" contenteditable data-value="Name">"Name"</div>
    </td>
  </tr>
  <tr>
    <td>"11121341"</td>
    <td>"asdf"</td>
    <td>
      <div class="device-name" contenteditable data-value="Name">"Name"</div>
    </td>
  </tr>
</table>

的JavaScript

$('.device-name').on('blur', function(event){
    alert(event.target.getAttribute('data-value'));
alert(event.target.textContent);
})

Answer 1

target属性可以是为事件或其后代注册的元素。将event.target与this进行比较以确定是否由于事件冒泡而处理事件通常很有用。当事件冒泡时，此属性在事件委派中非常有用。

source

所以在你的情况下它和你做的一样

$('.device-name').on('blur', function(event) {
  alert(this.defaultValue);
  alert(this.textContent);
});

没有defaultValue

这样的东西

<强>解决方案

如果要存储值，可以将其分配给元素属性，然后使用jQuery函数attr()或data()或javascript函数getAttribute()

对其进行检索。

＆＃13;

$('.device-name').on('blur', function(event) {
  alert(event.target.getAttribute('data-default'));
  alert($(event.target).attr('data-default'));
  alert($(event.target).data('default'));
  alert(event.target.textContent);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="data table-bordered table table-striped" id="ui" method="POST">
  <tr style="background-color:blue;color:white;">
    <td width="25%">Device-imei</td>
    <td>Device-Model</td>
    <td>device-nickname</td>
  </tr>
  <tr>
    <td>"111111"</td>
    <td>"Model"</td>
    <td>
      <div class="device-name" contenteditable data-default="Name">"Name"</div>
    </td>
  </tr>
  <tr>
    <td>"11121341"</td>
    <td>"asdf"</td>
    <td>
      <div class="device-name" contenteditable data-default="Name">"Name"</div>
    </td>
  </tr>
</table>

＆＃13;

如何获取事件目标默认值JavaScript

1 个答案: