Question

if (valueInput == jsyl) {
    var correctBtn = $('<button/>', {
        'class': 'btn btn-success buttonCorrect',
        'type': 'button',
        'id': "button" + CBC++,
        'html': valueInput
    });
    $(this).replaceWith(correctBtn);
    S.playRight();
    S.addRight();
}

上面的代码是可以成功运行的代码（请注意，并非所有代码）。下面的代码就是我要替换的correctBtn变量。但是，每当我使用button时，它也会同时显示valueInput，但是当我对输入字段执行完全相同的操作时，它确实仍然是输入字段，并且确实表明我已经填写了一个单词，但它不会显示。给您一个想法：好像文本颜色是白色，背景颜色也是白色。您确实看到有东西填写了，但是看不到它。

var correctInput = $('<input/>', {
    'class': 'form-control ss',
    'type': 'text',
    'id': 'button' + CBC++,
    'html': valueInput
});

应该怎么做才能做到这一点？

完整功能如下：（请注意，使用的变量来自correctBtn），但是我试图将按钮更改为输入字段。

function prepareCheck() {
  $.getJSON('json_files/jsonData_' + ID + '.json', function(json) {
       $(document).on('change', '.syl-input', function() {
           var rowCounter = $(this).parent().parent().parent().parent().attr('id');
           var inputCounter = $(this).attr('id');
           var jsyl = json.main_object.main_object.exercises[rowCounter].syllables[inputCounter];
           var jsylall = json.main_object.main_object.exercises[rowCounter].syllables;
           var valueInput = $(this).val();

       if (valueInput == jsyl) {
           var correctBtn = $('<button/>', {
              'class': 'btn btn-success buttonCorrect',
              'type': 'button',
              'id': "button" + CBC++,
              'html': valueInput
          });
          $(this).replaceWith(correctBtn);
              S.playRight();
              S.addRight();
       }
    })
}

Answer 1

您正在尝试添加input元素并为其分配html。每个定义input元素不能包含其他html。

您可能想改用value：

var correctInput = $('<input/>', {
    'class': 'form-control ss',
    'type': 'text',
    'id': 'button' + CBC++,
    'value': valueInput
});

为什么我的按钮有效，但是当我将其设为输入字段时却无效？

1 个答案: