作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我已经制作了有 1 个问题的表格。有 4 个单选按钮选项和 1 个用于 other
单选按钮的输入框。如果选中另一个单选按钮,如何从输入框中获取值。
class ContactForm extends Component {
setGender(event){
console.log(event.target.value);
}
render(){
<form>
<div id="gender" onChange={this.setGender.bind(this)}>
<div className="form-group">
<div className="col-sm-offset-2 col-sm-10">
<h4>What is your gender?</h4>
</div>
</div>
<div className="form-group">
<div className="col-sm-offset-2 col-sm-10">
<div className="radio">
<label><input type="radio" name="gender"/> Female</label>
</div>
</div>
</div>
<div className="form-group">
<div className="col-sm-offset-2 col-sm-10">
<div className="radio">
<label><input type="radio" name="gender"/> Male</label>
</div>
</div>
</div>
<div className="form-group">
<div className="col-sm-offset-2 col-sm-10">
<div className="radio">
<label><input type="radio" name="gender"/> Prefer not to say</label>
</div>
</div>
</div>
<div className="form-group">
<div className="col-sm-offset-2 col-sm-10">
<div className="radio">
<label><input type="radio" name="gender"/>Other</label>
<input type="text" class="form-inline" id="other1"/>
</div>
</div>
</div>
</div>
</form>
}
最佳答案
您可以对组件进行一些更改。
创建了 fiddle为了它
添加了以下方法以使其正常工作。
setGender(checkedValue){
console.log(checkedValue);
if(checkedValue == '-1'){
// get data from text box
}
}
关于javascript - 如何使用 ReactJS 从单选按钮和输入框获取值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48973746/
我是一名优秀的程序员,十分优秀!