JS因某些原因无法工作

时间:2018-02-03 05:10:59

标签: javascript html css

我只是编写了一些东西,但后来我添加(或删除)了一些东西,并且所有JS代码都停止了工作。(其他一切都很好)

<!DOCTYPE html>
<html>
  <head>
    <title>Test Page</title>
    <style>
      .embed-test {
      color:maroon;
      font-family: Cursive;
     }
.embed2{
      font-size:50px;
     }
.stpd{
      font-family:Comic Sans MS;
     }
th,
td{
      border:2px solid black;
      font-family:Arial;
      color:#000010;
      font-size:25px;
      text-align:center;
  }
table{
      border:3px solid black;
     }
      .tf{
        width:200px
      }
.JS{
      padding: 0.75em 1.25em;
      background-color:whitesmoke;
      width:10em
      }
.imp{
      background-color:black;
      font-family:Arial;
      color:white;
      font-size:200px;
      letter-spacing:5px;
      width:6em;
      padding: 0.25em 0.25em;
      }
.arinf{
      font-size:20px;
      font-family: Arial;
      }
.JS2{
      padding: 0.5em 0.5em;
      background-color:gray;
      width:12em;
      font-family: Arial;
      font-size:20px;
      }
.ce{
      border: 2px solid black;
   }
.hidden{
      display: none;
       }
.pass{
      width: 200px;
      margin-top:1px;
      font-size:20px;
     }
    </style>
  </head>
  <body>
    <script src='https://code.jquery.com/jquery-3.1.0.min.js'>
      //IDK
      $('.arinf').toggle();
      //Submit form
      //Click Me
      $('.JS').on('click',function(){
            $(this).hide();
            $(this).fadeIn(1000);
          })
      //arrow.io info
       $('.JS2').on('click', function(){
          if()
          $('#hidd').removeClass('hidden');
          $('.arinf').slideToggle();
           });
      //Veryuglybutton
         $('.hidden').fadeOut(500);
       $('.ignoreplz').on('click',function(){
         $('.ignore').fadeOut(1000);
         $('.ignoreplz').fadeOut(4000);
         })
       //此非詐騙集團
       alert('恭喜你來到了這個網頁,點擊OK繼續')
    </script>
    <h1>61602 :)</h1>
    <p>要看程式碼</p>
    <p>按Ctrl+U</p>

    <p>全部都是我寫的</p>
    <p>我中打很慢,所以這個網頁幾乎是全英文的XD</p>
    <form>
      輸入代碼:<br>
      <input type='text' name='passw' class='pas'><br>
      <input type='submit' name='submit' class='submit'>
    </form>
    <nav>
      <a href="#1">1</a>
      <a href="#2">2</a>
    </nav>
    <div id="1"></div>
    <h1>Blank Page, Used for Coding Practicing and Testing</h1>
    <p> edited through NotePad</p>
    <h3 class="embed-test"> CSS in HTML using style tag</h3>
    <h3 class="embed2"> test 2</h3>
    <p style="color:green">GREEN/</p>
    <h2>TABLE TEST</h2>
      <table>
        <thead>
          <tr>
            <th>Person</th>
            <th class="tf">Desc</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>Howard</td>
            <td class="stpd tf">Stoopid</td>
          </tr>
        </tbody>
      </table>
     <h2>JS EMBED TEST</h2>
     <h6>Imcomplete</h6>
     <p class="JS">Click Me</p>
     <script src='https://code.jquery.com/jquery-3.1.0.min.js'></script>
     <p>Click!</p>
     <p>Size comp</p>
     <h1>h1</h1>
     <h2>h2</h2>
     <h3>h3</h3>
     <h4>h4</h4>
     <h5>h5</h5>
     <h6>h6</h6>
     <p>p</p>
     <p class="JS2">Click to show arrow.io info</p>
     <div id="hidd" class="arinf hidden">
       <h1 class="imp"><strong>IMPORTANT</strong><br />arrow.io</h1>
       <h1>7: vivi</h1>
       <h1>3: 曾宥程</h1>
       <h1>5: poo</h1>
       <h1>2: MCS</h1>
     </div>
    <div contenteditable="true" class="ce"></div>
     <button class="ignoreplz">Very<b>ugly</b>button<b>do</b>not<b>press</b></button>
     <blockquote class="ignore"><i><b>Hi.This is some random text that you should not care about.Plz ignore this<br />ABCDEFGHIJKLMNOPQRSTUVWXYZ<br />abcdefghijklmnopqrstuvwxyz</b></i></blockquote>
  </body>
</html>     

P.S。我很新,很抱歉,如果有太多的代码,那就是整个页面 和Stackover只是一直告诉我要添加更多的细节,所以我只是填补它xd

2 个答案:

答案 0 :(得分:0)

像这样使用脚本标记

<html>
  <head>
    <title>Test Page</title>
    <script src='https://code.jquery.com/jquery-3.1.0.min.js'></script>
    <style>
      .embed-test {
      color:maroon;
      font-family: Cursive;
     }
.embed2{
      font-size:50px;
     }
.stpd{
      font-family:Comic Sans MS;
     }
th,
td{
      border:2px solid black;
      font-family:Arial;
      color:#000010;
      font-size:25px;
      text-align:center;
  }
table{
      border:3px solid black;
     }
      .tf{
        width:200px
      }
.JS{
      padding: 0.75em 1.25em;
      background-color:whitesmoke;
      width:10em
      }
.imp{
      background-color:black;
      font-family:Arial;
      color:white;
      font-size:200px;
      letter-spacing:5px;
      width:6em;
      padding: 0.25em 0.25em;
      }
.arinf{
      font-size:20px;
      font-family: Arial;
      }
.JS2{
      padding: 0.5em 0.5em;
      background-color:gray;
      width:12em;
      font-family: Arial;
      font-size:20px;
      }
.ce{
      border: 2px solid black;
   }
.hidden{
      display: none;
       }
.pass{
      width: 200px;
      margin-top:1px;
      font-size:20px;
     }
    </style>
  </head>
  <body>

    <h1>61602 :)</h1>
    <p>要看程式碼</p>
    <p>按Ctrl+U</p>

    <p>全部都是我寫的</p>
    <p>我中打很慢,所以這個網頁幾乎是全英文的XD</p>
    <form>
      輸入代碼:<br>
      <input type='text' name='passw' class='pas'><br>
      <input type='submit' name='submit' class='submit'>
    </form>
    <nav>
      <a href="#1">1</a>
      <a href="#2">2</a>
    </nav>
    <div id="1"></div>
    <h1>Blank Page, Used for Coding Practicing and Testing</h1>
    <p> edited through NotePad</p>
    <h3 class="embed-test"> CSS in HTML using style tag</h3>
    <h3 class="embed2"> test 2</h3>
    <p style="color:green">GREEN/</p>
    <h2>TABLE TEST</h2>
      <table>
        <thead>
          <tr>
            <th>Person</th>
            <th class="tf">Desc</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>Howard</td>
            <td class="stpd tf">Stoopid</td>
          </tr>
        </tbody>
      </table>
     <h2>JS EMBED TEST</h2>
     <h6>Imcomplete</h6>
     <p class="JS">Click Me</p>

     <p>Click!</p>
     <p>Size comp</p>
     <h1>h1</h1>
     <h2>h2</h2>
     <h3>h3</h3>
     <h4>h4</h4>
     <h5>h5</h5>
     <h6>h6</h6>
     <p>p</p>
     <p class="JS2">Click to show arrow.io info</p>
     <div id="hidd" class="arinf hidden">
       <h1 class="imp"><strong>IMPORTANT</strong><br />arrow.io</h1>
       <h1>7: vivi</h1>
       <h1>3: 曾宥程</h1>
       <h1>5: poo</h1>
       <h1>2: MCS</h1>
     </div>
    <div contenteditable="true" class="ce"></div>
     <button class="ignoreplz">Very<b>ugly</b>button<b>do</b>not<b>press</b></button>
     <blockquote class="ignore"><i><b>Hi.This is some random text that you should not care about.Plz ignore this<br />ABCDEFGHIJKLMNOPQRSTUVWXYZ<br />abcdefghijklmnopqrstuvwxyz</b></i></blockquote>
     <script>
      //IDK
      $('.arinf').toggle();
      //Submit form
      //Click Me
      $('.JS').on('click',function(){
            $(this).hide();
            $(this).fadeIn(1000);
          })
      //arrow.io info
       $('.JS2').on('click', function(){
          if()
          $('#hidd').removeClass('hidden');
          $('.arinf').slideToggle();
           });
      //Veryuglybutton
         $('.hidden').fadeOut(500);
       $('.ignoreplz').on('click',function(){
         $('.ignore').fadeOut(1000);
         $('.ignoreplz').fadeOut(4000);
         });
      alert("your error")
    </script>
  </body>
</html>

工作代码链接 https://codepen.io/crowm/pen/eVpZYB

答案 1 :(得分:0)

您无法将外部脚本与内联/内部脚本结合使用。

<script src='https://code.jquery.com/jquery-3.1.0.min.js'>
  //IDK
  $('.arinf').toggle();

您的代码需要

<script src='https://code.jquery.com/jquery-3.1.0.min.js'><script>
<script>
  //IDK
  $('.arinf').toggle();
相关问题