jquery代码有什么错误？答案

【问题标题】：What are the errors with jquery code?jquery代码有什么错误？
【发布时间】：2018-10-15 19:06:29
【问题描述】：

@foreach($deductionrules as $deductionrule)
 <tr>
   <td><b>{{ $deductionrule->leavePenalty }}</b></td>
   <td><b>{{ $deductionrule->absentPenalty }}</b></td><td><b>{{ $deductionrule->latePenalty }} | {{ $deductionrule->deductionId }}</b></td>

   <td align="center">
    <button class="btn btn-danger delete-deductionrules" data-iddeductionrules="{{ $deductionrule->deductionId }}" ><i class="fa fa-trash"></i></button>
   <button class="btn btn-success edit-deductionrules" data-rolesid="{{ $deductionrule->deductionId }}" data-leavePenalty="{{ $deductionrule->leavePenalty }}"  data-absentPenalty="{{ $deductionrule->absentPenalty }}" data-latePenalty="{{ $deductionrule->latePenalty }}" ><i class="fa fa-edit m-right-xs"></i></button>
   </td>
 </tr>
@endforeach

这是我的 jquery 脚本类型="text/javascript" src="{{asset('js/jquery.min.js')}}">

<script type="text/javascript">
           // edit deduction rules modal
            $(document).on('click', '.edit-deductionrules', function() {


              $('#id_edit').val($(this).data('rolesid'));
              $('#absentPenalty').val($(this).data('absentPenalty'));
              $('#latePenalty').val($(this).data('latePenalty'));
              $('#editrule').modal('show');

            });
        </script>

从这里只能访问 id。这有什么问题？

【问题讨论】：

jQuery 会自动加载到 Laravel 中。

标签： jquery laravel

【解决方案1】：

使用$(this).attr('data-absentPenalty'); 而不是.data(...)

           $(document).on('click', '.edit-deductionrules', function() {

              $('#id_edit').val($(this).attr('data-rolesid'));
              $('#absentPenalty').val($(this).attr('data-absentPenalty'));
              $('#latePenalty').val($(this).attr('data-latePenalty'));
              //$('#editrule').modal('show');
              //for test...
                $('#div_for_edit').slideDown();
            });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>



<table width="100%" border="1">
 <tr>
   <td><b>leavePenalty</b></td>
   <td><b>absentPenalty</b></td><td><b>latePenalty | deductionId</b></td>

   <td align="center">
    <button class="btn btn-danger delete-deductionrules" data-iddeductionrules="deductionId" ><i class="fa fa-trash"></i>X</button>
   <button class="btn btn-success edit-deductionrules" data-rolesid="deductionId" data-leavePenalty="leavePenalty"  data-absentPenalty="absentPenalty1" data-latePenalty="latePenalty1" ><i class="fa fa-edit m-right-xs"></i>edit</button>
   </td>
 </tr>

 <tr>
   <td><b>leavePenalty</b></td>
   <td><b>absentPenalty</b></td><td><b>latePenalty | deductionId</b></td>

   <td align="center">
    <button class="btn btn-danger delete-deductionrules" data-iddeductionrules="deductionId" ><i class="fa fa-trash"></i>X</button>
   <button class="btn btn-success edit-deductionrules" data-rolesid="deductionId" data-leavePenalty="leavePenalty"  data-absentPenalty="absentPenalty2" data-latePenalty="latePenalty2" ><i class="fa fa-edit m-right-xs"></i>edit</button>
   </td>
 </tr>
</table>



<div id="div_for_edit" style="display:none;">
   <input type="text" id="id_edit" value=""/>
    <input type="text" id="absentPenalty" value=""/>
    <input type="text" id="latePenalty" value=""/>
</div>

【讨论】：

我怎样才能传递像 data-absentPenalty="absentPenalty2" 这样的值？我必须通过 foreachloop 或 forloop 从数据库中传递值
$(this).attr('data-absentPenalty', 'absentPenalty2');

【解决方案2】：

这些 id 的元素在哪里？喜欢 id_edit？如果它们不是输入，则将它们更改为输入

【讨论】：