Question

嗨，这里的朋友是我用原生javascript做的代码。但是现在我想在jQuery中做同样的事情。

html -

    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8">
      <title>JS Bin</title>
    </head>
    <body>
      <form>
        <fieldset>
          <legend>Suscribe</legend>
          <p><input id='newsYes' type='checkbox' /> Please send me monthly discount.</p>
    <p>Email: <input id='newsEmail' type='text' placeholder='your email' disabled/></p>
        </fieldset>
      </form>
    </body>
    </html>

css - 

#newsEmail {
 width: 175px;
}
#newsEmail:disabled {
  background: #999;
}
#newsEmail:enabled {
  background: #fff;
}

javascript -

    var elem = document.getElementById('newsYes');

    elem.onclick = function(){
      if(elem.checked){
        document.getElementById('newsEmail').disabled = false;
      }else {
       document.getElementById('newsEmail').disabled = true;
      }
    };

这是工作的javascript jsbin链接 - http://jsbin.com/vumuf/1/edit?html,css,js,output

Answer 1

您可以将 .click() 用于jQuery中的点击事件以及 .prop() 来设置input的状态：< / p>

$('#newsYes').click(function () {
    $('#newsEmail').prop('disabled', !this.checked)
})

<强> Fiddle Demo

使用jQuery禁用文本字段

1 个答案: