Question

我是jquery的新手，但我会尽力解释我的问题，这是我的问题：我有一个输入，我会在其中写一个随机问题例如 - 你多大了？我有2个按钮，第一个说：放在上面，第二个放在下面...现在我已经有2个问题，每个问题都有一个复选框，如果我在输入上写下并点击第一个按钮那个问题就是第一个问题＆＃34;它将高于其他问题（它将包括复选框）＆＃34;如果我点击第二个按钮，它将低于其他按钮＆＃34;它将包含复选框＆＃34;

问题是，我怎么能这样做，我需要保存所有行？或如何这是我的源代码，这就是我现在拥有的所有内容：

touch(...Object.keys(fields))

这是js

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8"/>
    <link rel="stylesheet" href="style.css">
    <script src="js/jquery-2.1.4.min.js"></script>
    <script src="js/file2.js"></script> 
</head>
<body>
<div id="id" class="mi_clase">
<input type="text" id="pregunta">
<button id="arriba" type="button">Poner arriba</button>
<button id="abajo" type="button">Poner abajo</button>
    <table><tbody>
    <tr>
    <td>Te gusta el cine?</td>
    <td><input type="checkbox" value="1"/></td>
    <td id="eliminar">Eliminar</td>
    </tr>
    <tr>
    <td>Te gusta los tacos?</td>
    <td><input type="checkbox" value="2"/></td> 
    <td id="eliminar">Eliminar</td>
    </tr>
    </tbody></table>
    <button id="guardar" type="button">Guardar</button>     
</div>
<div class="mi_clase">


</div>
</body>
</html>

Answer 1

我会建议2件事？ 1.用视觉来理解你想要什么 2.Never基于乱码的名字选择器或变量：）

根据我的理解，您需要根据标记的复选框删除行，对吗？如果是这样..它的退出简单我为你制作了这个代码：

EDIT1： http://codepen.io/Mohamedamin/pen/vLJQEE

$('#down').on('click', function(){
  var question = $('#pregunta').val()
  $('.stuff').append(makeRow(question));
});
$('#up').on('click', function(){
  var question = $('#pregunta').val()
  $('.stuff').prepend(makeRow(question));
});

$('#save').on('click',function(){
   var checked = $('input:checked').closest('tr')
   console.log(checked)
});
function makeRow(question){
  var row = '<tr>' +
         '<td>' + question +'</td>' +
         '<td><input type="checkbox"/></td> ' +
         '</tr>'
  return row;
};

Answer 2

仍然不确定你想要完成什么。我写了一些代码，在插入第一行之后，将在所选行之前添加或追加。单选按钮用于选择目标行。单选按钮也用于删除行。

     <script type="text/javascript">

            $(document).ready(function () {

                $("#guardar").click(function () {
                    $(":radio:checked").closest("tr").remove();
                });

                $("#arriba").click(function () {
                    var p = $("#pregunta").val();
                    if (p.length > 0) {
                        var $tr = createRow(p);
                        // first added row, just put it at the bottom
                        if ($(":radio").length == 0) {
                            // no rows added yet
                            $("table tbody").append($tr);
                        }
                        else {
                            if($(":radio:checked").length == 0){
                                // rows added but now rows selected so put it first.
                                $($(":radio")[0]).closest("tr").before($tr);
                            }
                            else{
                                $(":radio:checked").closest("tr").before($tr);
                            }
                        }
                        $("#pregunta").val("");
                    }
                });

                $("#abajo").click(function () {
                    var p = $("#pregunta").val();
                    if (p.length > 0) {
                        var $tr = createRow(p);
                           // first added row, just put it at the bottom
                        if ($(":radio").length == 0 || $(":radio:checked").length == 0) {
                            // no rows added yet
                            $("table tbody").append($tr);
                        }
                        else {
                            $(":radio:checked").closest("tr").after($tr);
                        }
                        $("#pregunta").val("");
                    }
                });

            });
            function createRow(p) {
                var $tr = $("<tr></tr>");
                $tr.append("<td>" + p + "</td>")
                $tr.append("<td><input type='radio' name='rdo' value='2' /></td>");
                $tr.append("<td></td>");
                return $tr;
            }
        </script>

和

     <form name="form" action="action.php" method="post" onsubmit="return validation()">
            <div id="id" class="mi_clase">
                <input type="text" id="pregunta">
                <button type="button" id="arriba">Put Above</button>
                <button type="button" id="abajo">Put Below</button>
                <table>
                    <tbody>
                        <tr>
                            <td>Te gusta el cine?</td>
                            <td><input type="checkbox" value="1" /></td>
                            <td id="eliminar">Delete</td>
                        </tr>
                        <tr>
                            <td>Te gusta los tacos?</td>
                            <td><input type="checkbox" value="2" /></td>
                            <td id="eliminar">Delete</td>
                        </tr>
                    </tbody>
                </table>
                <button type="button" id="guardar">Guardar</button>
            </div>
            <div class="mi_clase"></div>
    </form>

如何控制按钮与jquery

2 个答案: