Question

我在向提交按钮添加glyphicon图标时遇到问题。一旦我用＆＃34; a＆＃34;标签，按下按钮时动作不起作用。那我该怎么做呢？

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>

<form method="post" action="<%=Const.ActionURIs.INSTRUCTOR_COURSE_STUDENT_LIST_DOWNLOAD%>" style="display:inline;">
            <input id="button_download" type="submit" class="btn btn-primary"
                    name="<%=Const.ParamsNames.FEEDBACK_RESULTS_UPLOADDOWNLOADBUTTON%>"
                    value=" Download Student List ">

            <input type="hidden" name="<%=Const.ParamsNames.USER_ID%>" value="${data.account.googleId}">
            <input type="hidden" name="<%=Const.ParamsNames.COURSE_ID%>" value="${courseDetails.course.id}">
        </form>

</body>
</html>

Answer 1

使用<input>代码而不是<button type="submit" class="btn btn-primary" id="button_download" name="<%=Const.ParamsNames.FEEDBACK_RESULTS_UPLOADDOWNLOADBUTTON%>"> <span class="glyphicon glyphicon-download-alt"></span> Download Student List </button>代码。像这样更改你的按钮：

<span>

它不起作用的原因在Bootstrap website上给出。

不要与其他组件混合：图标类不能直接与其他组件结合使用。它们不应与同一元素上的其他类一起使用。而是添加嵌套的<span>并将图标类应用于<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <form> <button type="submit" class="btn btn-primary"> <span class="glyphicon glyphicon-download-alt"></span> Download Student List </button> </form>。

工作示例：

＆＃13;

<div>
    James
   <div>English : <span class="jtest">80</span> </div>
   <div>Japanese : <span class="jtest">60</span> </div>
   <div>Science : <span class="jtest">78</span> </div>
   <div>Art : <span class="jtest">85</span> </div>
   <div>Philosophy : <span class="jtest">45</span> </div>
   <div>Physical tranning : <span class="jtest">65</span> </div>
</div>
<br><Br>
 <div>
    Von
   <div>English : <span class="vtest">80</span> </div>
   <div>Japanese : <span class="vtest">85</span> </div>
   <div>Science : <span class="vtest">67</span> </div>
   <div>Art : <span class="vtest">64</span> </div>
   <div>Philosophy : <span class="vtest">97</span> </div>
   <div>Physical tranning : <span class="vtest">25</span> </div>
</div>
<br><Br>
 <div>
    Crack
   <div>English : <span class="ctest">80</span> </div>
   <div>Japanese : <span class="ctest">88</span> </div>
   <div>Science : <span class="ctest">40</span> </div>
   <div>Art : <span class="ctest">70</span> </div>
   <div>Philosophy : <span class="ctest">80</span> </div>
   <div>Physical tranning : <span class="ctest">69</span> </div>
</div>

＆＃13;

分配＆＃34; glyphicon download-alt＆＃34;图标到提交按钮

1 个答案: