javascript - 为什么我的 <div> 内容 </div> 会闪烁？

Question

我是 Jquery 世界的新手，所以有人可以帮助我理解我的 $("#dothis").html("hit"); 让内容只闪烁而不是简单地展示？ 我认为该功能正在 self 重复，这就是造成它的原因。

html代码:

        <form>
        <select class="plcardFirst">
          <option selected value="">-- Choose One --</option>
          <option value="1/11">A</option>
          <option value="1">1</option>
          <option value="2">2</option>
          <option value="3">3</option>
          <option value="4">4</option>
          <option value="5">5</option>
          <option value="6">6</option>
          <option value="7">7</option>
          <option value="8">8</option>
          <option value="9">9</option>
          <option value="10">10</option>
          <option value="10">J</option>
          <option value="10">Q</option>
          <option value="10">K</option>
            </select>
        <select class="plcardSecond">
          <option selected value="">-- Choose One --</option>
          <option value="1/11">A</option>
          <option value="1">1</option>
          <option value="2">2</option>
          <option value="3">3</option>
          <option value="4">4</option>
          <option value="5">5</option>
          <option value="6">6</option>
          <option value="7">7</option>
          <option value="8">8</option>
          <option value="9">9</option>
          <option value="10">10</option>
          <option value="10">J</option>
          <option value="10">Q</option>
          <option value="10">K</option>
            </select>
        <select class="dlCard">
          <option selected value="">-- Choose One --</option>
          <option value="1/11">A</option>
          <option value="1">1</option>
          <option value="2">2</option>
          <option value="3">3</option>
          <option value="4">4</option>
          <option value="5">5</option>
          <option value="6">6</option>
          <option value="7">7</option>
          <option value="8">8</option>
          <option value="9">9</option>
          <option value="10">10</option>
          <option value="10">J</option>
          <option value="10">Q</option>
          <option value="10">K</option>
            </select>
            <input type="submit" value="Submit" id="Submit">
        </form>
    <div id="dothis"> do this </div>

脚本:

     <script type="text/javascript">
           var valueFirst;
           var valueSecond;
           var dlCard;
          $(document).ready(function () {
            $(".plcardFirst").change(function() {
               valueFirst = $( ".plcardFirst" ).val();//player first card;
            });
            $(".plcardSecond").change(function() {
               valueSecond = $( ".plcardSecond" ).val();//player second card
            });
            $(".dlCard").change(function() {
              dlCard = $( ".dlCard" ).val();//dealer card
            });
            $("#Submit").click(function(){
              $("#dothis").html("hit");
            });
        }); 
   </script>

Answer 1

它闪烁是因为您正在使用提交按钮并且您没有取消提交操作所以页面提交表单并重新加载页面。

$("#Submit").click( function (e) {
    e.preventDefault();  //cancel the click
    $("#dothis").html("hit");
});