Question

我将HTML元素中的一些数据设置为值。但是当我使用e.target.value获得价值时，它会截断价值。

  <li value="74fd5135-e756-41af-a0f7-6eaf20bc2551" OnClick= 
  {this.SelectedItem}>Something </li>

  SelectedItem =(e)=>
  {
   e.target.value ;   //its gives me 74
  }

它应该向我返回与我设置的相同的数据

74fd5135-e756-41af-a0f7-6eaf20bc2551

Answer 1

列表项的value属性只能包含数字

value

此整数属性表示元素定义的列表项的当前序数值。 此属性唯一允许的值为数字，即使列表中显示的是罗马数字或字母。列表项之后的列表项将从值集中继续编号。值属性对于无序列表（<ul>）或菜单（<menu>）没有意义。

来源：another blog

列表项value属性的定义：

[Exposed=Window, HTMLConstructor]
interface HTMLLIElement : HTMLElement {
  [CEReactions] attribute long value;
};

来源：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/li

Answer 2

你可以这样通过。

 //option 1
 <li OnClick={()=>this.SelectedItem("74fd5135-e756-41af-a0f7-6eaf20bc2551")}>Something </li>

 //option 2
 <li OnClick={this.SelectedItem.bind(this,"74fd5135-e756-41af-a0f7-6eaf20bc2551"}>Something </li>

  SelectedItem =(value)=>
  {
    console.log(value);
  }

为什么event.target.value被截断？

2 个答案: