js使用onkeypress按值对输入行进行排序

时间:2018-06-20 10:55:49

标签: javascript jquery html

var selectedinput;
document.addEventListener("focus",function(event){
    if(event.target.tagName.toLowerCase()==="input"){
         selectedinput = event.target;
    }
},true);
function insert(pos)
{
    if(!selectedinput) return;
    var tr = $(selectedinput).closest("tr");
    pos=='above' ? tr.before(tr.html()) : tr.after(tr.html());
}
function save(){
alert("This is OK");
}
<html>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<body>
<form>
    <center>
        <button onclick="insert('above')">Insert Above</button>
        <button onclick="insert('below')">Insert Below</button>
        <br>
        <table id="thisTable">
            <tr>
                <th>Title 1</th>
                <th>Title 2</th>
                <th>Title 3</th>
            </tr>
            <tr>
                <td><input id="num1" onkeypress="sortable();"></td>
                <td><input id="char1"></td>
                <td><input id="type1"></td>
            </tr>
            <tr>
                <td><input id="num2" onkeypress="sortable();"></td>
                <td><input id="char2"></td>
                <td><input id="type2"></td>
            </tr>
            <tr>
                <td><input id="num3" onkeypress="sortable();"></td>
                <td><input id="char3"></td>
                <td><input id="type3"></td>
            </tr>
        </table>
        <br><button onclick="save();">Save</button>
    </center>
</form>
</body>
</html>

JavaScript,HTML,Jquery ||如何使用“ onkeypress”对行进行排序并自动更改ID示例:当您在第一个列中输入数字时,行将在文本区域中按值自动排序,而id由值||自动更改之前和之后的图像示例,之后的图像:将数字5更改为数字3,并且行是自动排序

** **之前的表格 Image before ** **之后的表格 Image after

0 个答案:

没有答案