0

我想在单击链接时打开 div。链接值包含数据行的 id。我正在使用 ajax 将数据发布到表单。

模板.html

<div id="authorisedreporter" {% if not registerform.errors %}style="display:none"{% endif %}>
 <form method="post" action="." id="reporter-form">
 {% csrf_token %}
 <table  width="100%">
 <tr>
   <td style="width:100px;">First name:</td><td>{{registerform.first_name}} </td>
 </tr>
 <tr>
    <td>Last name:</td><td>{{registerform.last_name}} </td>
 </tr>
     ''''''''''''''''
     some data here
     '''''''''''''''
 </table></form></div>

上面的 div 在页面加载时处于隐藏状态。我想在单击链接时打开 div。

<td style="width:120px;"><a href="{{ list.0.id }}">{{list.0.first_name|title}} {{list.0.last_name}}</a></td>

需要帮忙。

4

2 回答 2

1

首先将 href="#"orhref="javasctipt:void(0)放入您的锚标签中，然后放入锚标签id的其他一些属性。那么脚本将是

$(document).ready(function(){
   $('a').click(function(){
      $('#authorisedreporter').show();
   });
});
于 2013-07-26T11:01:17.670 回答
1

如果它不是链接，请不要使用链接，在您的情况下，它更像是<button>：

<td style="width:120px;"><button id="{{ list.0.id }}" class="js-openDiv">{{list.0.first_name|title}} {{list.0.last_name}}</button></td>

无论如何，方法是相同的，将类添加class="js-openDiv"到您的<a>or<button>并将其用作 jQuery 中的选择器：

$('.js-openDiv').click(function () {
    var this_id = $(this).attr('id');  // the list ID
    // do something with the ID

    $('#authorisedreporter').show();
});

编辑：

如果您决定坚持使用<a>标签：

<td style="width:120px;"><a id="{{ list.0.id }}" class="js-openDiv" href="#">{{list.0.first_name|title}} {{list.0.last_name}}</a></td>

jQuery 代码会有点不同：

$('.js-openDiv').click(function (e) {
    e.preventDefault();

    var this_id = $(this).attr('id');  // the list ID
    // do something with the ID

    $('#authorisedreporter').show();
});

希望能帮助到你

于 2013-07-26T11:03:31.750 回答