javascript - get clicked button's name - Stack Overflow

admin管理员组

文章数量:1426182

I have the following button with event attached:

<button className="pull-right btn btn-success" onClick={this.onNextStep}>Next</button>

OnNextStep:

onNextStep: function (e) {
    ...
}

How do I get the button name inside onNextStep?

e.target.value is not working

And how do I change it?

I have the following button with event attached:

<button className="pull-right btn btn-success" onClick={this.onNextStep}>Next</button>

OnNextStep:

onNextStep: function (e) {
    ...
}

How do I get the button name inside onNextStep?

e.target.value is not working

And how do I change it?

• javascript
• reactjs

Share Improve this question Follow edited Feb 29, 2016 at 21:08 Evan Davis 36.7k77 gold badges5252 silver badges5858 bronze badges asked Feb 29, 2016 at 20:47 Rares MardareRares Mardare 27311 gold badge55 silver badges1515 bronze badges 3

• e.innerHTML should work. A button doesn't have a value. – Matthew Darnell Commented Feb 29, 2016 at 20:51
• @MatthewDarnell Are you sure? MDN (and functioning code) seem to think otherwise, e.g., developer.mozilla/en-US/docs/Web/HTML/Element/…, stackoverflow./q/5701831/438992) This button doesn't, but I'm pretty sure they can. – Dave Newton Commented Feb 29, 2016 at 21:03
• I realize OP is using React, but this question has nothing to do with React. – Evan Davis Commented Feb 29, 2016 at 21:08

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 5

e.target.textContent will give you the text of the button

I would suggest something like this:

<button
  type="button"
  className="pull-right btn btn-success"
  onClick={() => this.onNextStep('Next')}
>
  Next
</button>

Remember that React is mostly about writing to the DOM. Rarely do you read from it. (The exception being inputs.)

Your "value" is just a static piece of text. There is no need to get what you've already got.

You need a name attribute on that button name="next step" and you'll get it via e.target.name. To change it you could assign name={this.state.buttonName} and set state on that key when you need to (this.setState({ buttonName: "new button name" });). If you are talking about inner HTML as in the ment by Matthew, your button's name could be called from state <button>{this.state.name}</button> and setState could change that as well.

in react you can use onClick{(e) => e.target.innerHTML }

本文标签： javascriptget clicked button39s nameStack Overflow