前端： jquery绑定/动态变量/find/each/

目标与html代码

目标：点击jq删除，获取整行tr的id，（后端部分略，传递id处理即可），页面删除该tr行

  <tr myid="{{ cls.id }}">
     ....

      <td><a onclick="rmStu(this);" class="abc" href="#">jq删除</a></td>

【方式1】由onclick触发，点击位置由this传递

动态变量由字符串拼接

<script>
    function rmStu(th) {
    var myid=$(th).parent().parent().attr('myid');
    alert(myid);
{#    $(th).parent().parent().remove();#}
{#    $("[myid='11']").remove();#}
{#    $("[myid=myid]").remove();无法定位#}
    $("[myid="+myid+"]").remove();

    }
</script>

【方式2】事件绑定。点击触发，条件为任意class="abc"时。

触发时再由$(this)获取点击位置

<script>
    $(function () {
        bindEvent();
    });
    function bindEvent() {
        $('.abc').click(function () {
            var myid=$(this).parent().parent().attr('myid');
            alert(myid);

        })
    }

</script>

附录 bootstrap modal show

<script src="/static/jquery-3.3.1.js"></script>
<script src="/static/plugin/bootstrap-3.3.7/js/bootstrap.js"></script>
<script>
    $(function () {
        abc();
    });
    function abc() {
        $('#showmyModal').click(function () {
            $('#myModal').modal('show');
        })
    }

</script>

附录ajax

            $.ajax({
                url: '/ajax_deal/',
                type: 'POST',
                data: { var1: var1, var2:var2},
                success:function (arg) {
                    $('#id1').val(arg);
                }
            })

多属性查找
找到每个input整行

    var aaa = $("div[name='nam1'][attr1='XXX']").find("input[type='boy'][name='studentname']");
    console.log(aaa.val()); 

  $('xx').find('input').each(function () {
            console.log(this);
            console.log("####")
        })

找到每个行与数据，保存待用。 .find('a,b,c')可同时找多种

<script>
    $(function () {
        bindsth();
    });
    function bindsth() {
        var datadict={};
        $("div[name='xx'][school='xx']").find("input").each(function () {
            console.log(this);
            console.log("####");
            var value =$(this).val();
            var name=$(this).attr('name');
            datadict[name]=value;
        });
     }
</script>

checked无法用attr获取。用prop。
在jQuery 1.6及以后版本中，使用prop()函数来设置或获取checked、selected、disabled等属性。对于其它能够用prop()实现的操作，也尽量使用prop()函数。
布尔类型：attr 自定义值，html默认值。 实时值用prop
$('xx').prop('checked')
$('xx').prop('checked',True)

            if ($('input').prop('checked')) {
                $('input').prop('checked',false);
            }else{
                $('input').prop('checked',true);
            }

清空
$(':input','#myform')
.not(':button, :submit, :reset, :hidden')
.val('')
.removeAttr('checked')
.removeAttr('selected');

或
$('#myform')[0].reset();

转载于:https://blog.51cto.com/13606158/2074340