Question

这是HTML文件，我不知道缺少什么。我只需要了解onclick按钮的工作原理，因为这个按钮不起作用。

＆＃13;

    $('#add-form').click(function() {
      i++;
      $('#add-me').append(
        '<tbody id="row' + i + '"><tr>' +
        '<td class="col-md-2">' +
        '<input id="quantity" onkeypress="return event.charCode >= 48 && event.charCode <=57" type="text" name="quantity[]" class="form-control"/>' +
        '</td>' +
        '<td class="col-md-7">' +
        '<input type="text" name="description[]" class="form-control"/>' +
        '</td>' +
        '<td class="col-md-3">' +
        '<input type="text" name="selling_price[]" class="form-control" />' +
        '</td>' +
        '<td class="col-md-2">' +
        '<button id="' + i + '" type="button" class="btn btn-danger delegated-btn">Delete</button>' +
        '</td>' +
        '</tr></tbody>'
      );
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
  <div class="">
    <div class="row">
      <div class="col-md-8 col-md-offset-2 shad-content">
        <div class="panel-heading ">
          <h3>Please add new drugs</h3>
        </div>
        <div class="panel-body">
          <form action="" method="POST">
            {{ csrf_field() }}
            <table id="add-me" class="table table-bordered">
              <thead>
                <tr>
                  <th>Quantity</th>
                  <th>Description</th>
                  <th>Selling Price</th>
                  <th>Actions</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td id="quantity" class="col-md-2"><input onkeypress='return event.charCode >= 48 && event.charCode <=57' type="text" name="quantity[]" class="form-control" autofocus="" /></td>
                  <td class="col-md-7"><input type="text" name="description[]" class="form-control" /></td>
                  <td class="col-md-3"><input type="text" name="selling_price[]" class="form-control" /></td>
                  <td class="col-md-2">
                    <button type="button" class="btn btn-danger">
                    Delete</button>
                  </td>
                </tr>
              </tbody>
            </table>
            <div class="action-buttons">
              <button id="add-form" type="button" class="btn btn-default">Add New Form</button>
              <button type="submit" class="btn btn-success">Save All Drugs</button>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>

＆＃13;

Answer 1

在点击功能中，未声明i。这就是它显示错误的原因。请在jsfiddle中查看https://jsfiddle.net/8e40tvLq/。我希望你在html文件中包含了jquery。

var i=0;
$('#add-form').click(function() {

   i++;
    $('#add-me').append(
       '<tbody id="row'+i+'"><tr>'+
         '<td class="col-md-2">'+
            '<input id="quantity" onkeypress="return event.charCode >= 48 && event.charCode <=57" type="text" name="quantity[]" class="form-control"/>'
        +'</td>'
        +'<td class="col-md-7">'
            +'<input type="text" name="description[]" class="form-control"/>'
        +'</td>'
        +'<td class="col-md-3">'
            +'<input type="text" name="selling_price[]" class="form-control" />'
        +'</td>'
        +'<td class="col-md-2">'
            +'<button id="'+i+'" type="button" class="btn btn-danger delegated-btn">Delete</button>'
        +'</td>'
    +'</tr></tbody>'
    );});

onclick按钮不起作用

1 个答案: