Question

我创建了这个简单的表单

<html>
<head>
 <title>Datatable</title>
 <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
  <script type="text/javascript" src="../jquery-1.11.3.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
  <script type="text/javascript" src="../jquery/Jobseeker/EditDatatable.js"></script>
</head>

<body>
<form>
<table id="example">
<tr>
<td>
<label>Ab Va</label>
</td>
<td>
<input type="text" value="99"/>
</td>
</tr>
<tr>
<td>
<label>Sa Va</label>
</td>
<td>
<input type="text" value="9986"/>
</td>
</tr>

</table>
<button id="btn">Edit</button>
</form>
</body>
</html>

用于编辑此表的输入文本框的jquery代码是

$(document).ready(function() {
    var table = $('#example').DataTable();

    $('button').click( function() {
        var data = table.$('input, select').serialize();
        alert(
            "The following data would have been submitted to the server: \n\n"+

        );
        return false;
    } );
} );

我面临的问题是输入文本框字段ID可编辑而无需单击按钮＆＃34;编辑＆＃34;。但我希望它只有在用户点击“编辑”按钮时才可编辑。请让我知道我该怎么做

Answer 1

您可以将禁用的属性添加到输入中，然后在btn点击时将其删除。

<input type="text" value="99" disabled/>

<input type="text" value="9986" disabled/>


$(document).ready(function() {
    var table = $('#example').DataTable();

    $('button').click( function() {
        $('input').removeAttr('disabled');
        var data = table.$('input, select').serialize();
        alert("The following data would have been submitted to the server: \n\n");
        return false;
    } );
} );

Answer 2

使用此

$(document).ready(function() {
 var table = $('#example').DataTable();

 $('button').click( function() {
    $("input[type=text]").attr("readonly", false); 

    var data = table.$('input, select').serialize();
    alert("The following data would have been submitted to the server: \n\n"+);
    return false;
 });
});

使用readonly属性更改input type =“text”标签，如下所示

<input type="text" value="99" readonly />

Jquery可编辑输入文本框字段

2 个答案: