JavaScript id 选择器不起作用？不确定出了什么问题

Question

重要的 HTML

 <div class="input-group">
     <input type="text" id="q" class="form-control" placeholder="Search for User">
           <span class="input-group-btn">
                  <button class="btn btn-default" id="user_search" type="button"><i id="usersearchicon" class="fa fa-search"></i></button>
            </span>
 </div>
 <div id="user_results">
 </div>

有效的 jQuery 代码

<script type="text/javascript">
$(document).ready(function(){
    $("#user_search").click(function(){
        var q = $(".form-control").val().split(/[ ,]+/).join(',');
        $("#user_results").load("{% url 'search' %}?q=" + q);
     });
});
</script>

jquery 代码已损坏，但我宁愿使用。我认为我用来替换 .form-control 和 ajaxstart ajaxstop 的 #q id 正在破坏它。

<script type="text/javascript">
$(document).ready(function(){
    $("#user_search").click(function(){
        var q = $("#q").val().split(/[ ,]+/).join(',');
        $("#user_results").load("{% url 'search' %}?q=" + q);
     });
});
$(document).ajaxStart(function() {
    $("#usersearchicon").replaceWith("<i id="usersearchicon" class="fa-li fa fa-spinner fa-spin"></i>");
}).ajaxStop(function() {
    $("#usersearchicon").replaceWith("<i id="usersearchicon" class="fa fa-search"></i>");
});
</script>

知道出了什么问题吗？我是 javascript 和 jQuery 的新手，我正在努力让事情正常工作并查找语法错误。我感觉自己已经完成了 95%，但不知道出了什么问题。

我使用其中一些代码作为从 http://www.nomadjourney.com/2009/01/using-django-templates-with-jquery-ajax/ 构建的起始位置

编辑:固定 id q 引号不能相信是它哈哈。 ajaxStart 代码仍然损坏。

Answer 1

在 HTML 中定义 ID 时，请仔细查看“q”周围的引号 - 它们是特殊的风格化引号。将它们更改为常规引号，它应该可以工作!