javascript - 两个按钮可随着背景位置的变化而切换，并导致输入

Question

如何创建一个 jQuery/javascript 函数来：

1. 将其值插入输入框（男/女）
2. 更改其背景及其兄弟按钮的背景以显示它是否处于活动状态？

这是我的 HTML 开头：

<input type="button" class="ts" id="female" onclick="???????????" />
<input type="button" class="ts" id="male"   onclick="???????????" />

<input class="req-string bx long" type="text" id="gender" name="gender" />

Answer 1

这是一个示例，它将引导您走上正确的道路。它不符合您的要求，但您会明白的。

下面的代码将禁用另一个按钮：如果您单击“女性”，它将禁用“男性”，反之亦然。

$(function() {

  $('#female').click(function() {     

    // place text ("male" or "female") in an input 
    $('#gender').val('female');

    $('#female').css({background:'green'});
    $('#male').css({background:'red'});
  });

  $('#male').click(function() {      

    // place text ("male" or "female") in an input 
    $('#gender').val('male');

    // emulates the button being toggled
    $('#female').css({background:'red'});
    $('#male').css({background:'green'});
  });

});​