选中复选框时使用JQuery自动填写表单

当使用JQuery选中复选框时，我尝试填写表单输入。以下是我尝试过的：

HTML:

我是首席执行官，婊子

理想情况下，选中复选框后，表单输入将填充“我是CEO，婊子”并被锁定

JQuery：

if($('.reply_author_check').prop('checked')){

$('.reply_username').html(

    "<div class='form-group' class='reply_username'>
    <div class='col-sm-3'>
    <input type='text' class='form-control' name='username' disabled>"+ "I'm the CEO, bitch"
    </div>
    </div>"
    );

if（$（'.reply_author_check'）.prop（'checked'））{
$（'.reply_username'）.html(
"
“+“我是首席执行官，婊子”
"
);

})；

但是它不起作用，我无法从firebug获得错误MSG。任何建议都会非常有用。

尝试以下方法：

  $('.reply_author_check').on('change', function() {
    if  ($('.reply_author_check').is(':checked')) {
     $('input.reply_username').val('I\'m the CEO, bitch')
   });

---

你已经准备好了所有的HTML，那么为什么要用相同的东西覆盖它呢？通过它的name属性获取输入，然后改变你想要的

if($('.reply_author_check').prop('checked')){
    var $input = $('input[name="username"]'); //cache the jQuery object
    $input.prop("disabled",true);
    $input.prop("placeholder","");
    $input.val("I'm the CEO, bitch.");
}

---

不要覆盖DIV的HTML，只需根据需要修改输入元素

$(".reply_author_check").click(function() {
    if (this.checked) {
        $(".form-control").val("I'm the CEO, bitch").prop("disabled", true);
    } else {
        $(".form-control").removeProp("disabled");
    }
});

---

您的问题是您的.reply\u username div上有两个类属性。您只能有一个，您需要用空格分隔多个类。这将使您的代码正常工作，但实现这一点的更好方法是：

$('.reply_author_check').change(function () {
    if ($(this).is(':checked')) {
        $('input[name="username"]').prop('disabled', true).val("I'm the CEO, bitch"); 
    } else {
        $('input[name="username"]').prop('disabled', false).val('');
    }
});

---

jshiddle

一个问题是你的引号被弄乱了：

”）；

应该删除第一个引号。效果很好。非常感谢。非常感谢你的回答。

$('.reply_author_check').change(function () {
    if ($(this).is(':checked')) {
        $('input[name="username"]').prop('disabled', true).val("I'm the CEO, bitch"); 
    } else {
        $('input[name="username"]').prop('disabled', false).val('');
    }
});