OnClick不使用Bootstrap工作

Question

我曾与django和bootstrap合作，我对onclick属性有问题。当我单击按钮时，它不会显示我什么都没有。这是HTML：

{% extends 'base_profile.html' %}
{% block profile %}
<br />
    <div id="content">
        <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<div class="container">
    <div class="fb-profile">
        <img id='background_picture' align="left" class="fb-image-lg" src="https://s-media-cache-ak0.pinimg.com/originals/ad/38/bd/ad38bd348826054d3fd5e940950b1124.jpg" alt="Profile image example"/>
        {% load staticfiles %}
        <img id='profile_picture' align="left" class="fb-image-profile thumbnail" src="{% static 'media/{{path}}' %}" alt="media/{{path}}"/> 
        <!-- 200 x 200 -->
        <div class="fb-profile-text">
            <a href="/profile" id="full_name">{{ user.first_name }} {{ user.last_name }}</a>
            <div id="wrap">
            <p>
                <ul class="nav nav-tabs">
                    <li role="presentation" class="active"><a href="/profile">My profile</a></li>
                    <li role="presentation"><a href="/fallowers">Fallowers</a></li>
                    <li role="presentation"><a href="/fallowing">Fallowing</a></li>
                    <li role="presentation"><a href="/logout">Logout</a></li>
                    <li role="presentation">
                    <button id="compose" type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"> Compose Twitt
                    </button> </li>
                </ul>
            </p>
            <p>{{ user_profile.moto }}</p>
            {% for twitt in all_twitters reversed %}
            <hr>
            <div class="media">
                <div class="media-left media-middle">
                    <a href="#">
                    {% load staticfiles %}
                        <img class="media-object" src="{% static 'twittapp/images/logo_profile.png' %}" alt="Some picture">
                    </a>
                </div>
                <div class="media-body">
                    <h4 class="media-heading"><a href="">{{ user.first_name }} {{ user.last_name }}</a></h4>
                        {{ twitt.content }}
                </div>
            </div>
            <hr>
            <a href="javascript:void(0)" onclick="deleteTwitt();" class="btn btn-danger btn-sm"><span class="glyphicon glyphicon-trash"></span> Delete</a>
            <a href="#" class="btn btn-info btn-sm"><span class="glyphicon glyphicon-comment"></span> Comment</a>
            <a href="#" class="btn btn-info btn-sm"><span class="glyphicon glyphicon-eye-open"></span> See the comments</a>
            {% endfor %}
            </div>
        </div>
    </div>
</div> 
    </div>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Compose Twitt</h4>
      </div>
      <form action="/profile/compose/" method="post">{% csrf_token %}
        <div class="modal-body">
            <textarea style="resize:none" class="form-control" rows="3" cols="20" name="twitt_content" id="textarea"></textarea>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button id="save_twitt" type="submit" class="btn btn-primary">Twitt</button>
        </div>
        <p id="left_chars">sdks</p>
      </form>
    </div>
  </div>
</div>
{% endblock profile %}

这是位于外部JS文件中的功能：

function deleteTwitt(){
    $.post('/delete', {twitt_id: '{{ twitt.id }}'});
}; 

Answer 1

首先确保使用当前页面中的脚本标签嵌入了外部JS文件，如果不是，请嵌入并检查。如果文件已嵌入，则只需在您的HTML代码中更改以下内容

<a href="#" onclick="deleteTwitt();" class="btn btn-danger btn-sm"><span class="glyphicon glyphicon-trash"></span> Delete</a>

在这里，我刚刚从锚标签的HREF中删除了" JavaScript：void（0）"。尽管如此，如果它不起作用，请告诉我。