2016-03-28 2 views
0

Я новичок в JavaScript, и мне нужно использовать метод string всего на одной странице html. Мне нужно убедиться, что пользователь вводит данные, но я не могу заставить свою функцию работать. Есть идеи? Я закончил все это, но просто чтобы убедиться, что одна кнопка submit может полностью проверить всю функцию метода string.Вызывающая функция для работы

Это мой HTML-код:

<!DOCTYPE html> 
    <html> 
    <head> 
     <meta charset ="utf-8"/> 
     <h1> Try 1</h1> 
     <p>Please enter all the field below.</p> 
    </head> 
     <body> 
     <form id="myForm"> 
      <fieldset> 
      <legend>String Methods</legend> 

       <p>Using concat()</p> 
       <input type="text" id="word1" size="25" placeholder="Enter first word/sentences."></br> 
       <input type="text" id="word2" size="25" placeholder="Enter second word/sentences."></br></br> 

       <p>Using substr()</p> 
       <input type="text" id="subtr" size="25" placeholder="Please enter word/sentences."></br></br> 

       <p>Using lastIndexOf()</p> 
       <input type="text" id="lastindex" size="25" placeholder="Please enter word/sentences."></br> 
       <input type="text" id="srch" size="25" placeholder="Word that you want to search."></br></br> 

       <p>Using toLowerCase()</p> 
       <input type="text" id="lcase" size="35" placeholder="Please enter Uppercase word/sentences."></br></br> 

       <p>Using toUpperCase()</p> 
       <input type="text" id="ucase" size="35" placeholder="Please enter Lowercase word/sentences."></br></br> 

       <p>Using match()</p> 
       <input type="text" id="match" size="25" placeholder="Please enter word/sentences."></br> 
       <input type="text" id="match1" size="25" placeholder="Words that you want to find match."></br></br> 

       <p>Using replace()</p> 
       <p id="phrase"><i>The voice in my head shouts out through the world like a breath.</i></p> 
       <input type="text" id="replce" size="35" placeholder="Word you want to change in sentence above."></br> 
       <input type="text" id="replce2" size="25" placeholder="Word you want to change with."></br></br> 

       <p>Using split()</p> 
       <input type="text" id="splt" size="25" placeholder="Please enter word/sentences."></br></br> 

       <p>Using charCodeAt()</p> 
       <input type="text" id="cca" size="25" placeholder="Please enter word/sentences."></br></br> 

       <p>Using slice()</p> 
       <input type="text" id="slce" size="25" placeholder="Please enter word/sentences."></br></br> 

       <input type="submit" value="Submit" id="btnSubmit" onclick="validateEverything()"> 
      </fieldset> 

      </form> 
      <div id="answers"></div> 
      </body> 
     </html> 

Это мой код JavaScript:

<script> 
      function validateEverything(){ 
      var wo1 = document.getElementById("word1").value; 
      var wo2 = document.getElementById("word2").value; 

      var sub = document.getElementById("subtr").value; 

      var lin = document.getElementById("lastindex").value; 
      var sea = document.getElementById("srch").value; 

      var lca = document.getElementById("lcase").value; 
      var uca = document.getElementById("ucase").value; 

      var mat = document.getElementById("match").value; 
      var ma1 = document.getElementById("match1").value; 

      var phr = document.getElementById("phrase").value; 
      var rep = document.getElementById("replce").value; 
      var re1 = document.getElementById("replce1").value; 

      var ph1 = document.getElementById("phrase1").value; 
      var spl = document.getElementById("splt").value; 

      var cha = document.getElementById("cca").value; 

      var slc = document.getElementById("slce").value; 

      var ans = document.getElementById("answers"); 

      //Concat 
      var con = wo1.concat(" "+wo2); 

      //Subtr 
      var subr = sub.substring(1, 7); 

      //lastindexof 
      var n = lin.lastIndexOf(sea); 

      //toLowerCase 
      var lc = lca.toLowerCase(); 

      //toUpperCase 
      var uc = uca.toUpperCase(); 

      //match 
      var mc = mat.match(ma1); 

      //replace 
      var rp = phr.replace(replce, replce1); 

      //split 
      var sp = sp1.split(" ") 

      //charCodeAt 
      var cc = cha.charCodeAt(0); 

      //slice 
      var sl = slc.slice(1, 5); 

      show(); 
      } 

      function show(){ 
      ans.innerHTML = answersHTML(); 
      } 
      //answers 
      function answersHTML(){ 
      var ans = document.getElementById("answers").innerHTML; 
      document.write(con); 
      document.write(subr); 
      document.write(n); 
      document.write(lc); 
      document.write(uc); 
      document.write(mc); 
      document.write(rp); 
      document.write(sp); 
      document.write(cc); 
      document.write(sl); 

      } 
     </script> 
+1

где ты застрял? любые ошибки на консоли? – gurvinder372

+0

Вам нужно написать функции проверки в '$ (function() {.. код проверки ...})' или в функции готовности документа – Apb

+0

@Apb jQuery не находится в теге. Только javascript –

ответ

0

Есть несколько вопросов в вашем snippet.In некоторых случаях нет DOM элемент присутствует, но до сих пор вам делают document.getElementById();

Также как answerHTML будет знать о con,sub,....? Они являются локальными для validateEverything функции & вы не передавая его answerHTML функции

Вы используете input type = "submit". Для прекращения подачи заявки вам необходимо использовать event.preventDefault(). Вы ничего не подаете. Вместо использования input type = "button"

Там также не использование show() функции

Everytime вы используете document.write, поэтому он будет удалять ничего, что ранее написанное. Вместо строки concatenation и innerHTML будет хорошо. Вот рабочий фрагмент с минимальным кодом.

JS

function validateEverything(event){ 
      event.preventDefault(); 
      var wo1 = document.getElementById("word1").value; 
      var wo2 = document.getElementById("word2").value; 
      var sub = document.getElementById("subtr").value; 
      var ans = document.getElementById("answers"); 
      //Concat 
      var con = wo1.concat(" "+wo2); 
      //Subtr 
      var subr = sub.substring(1, 7); 

     ans.innerHTML = con+" "+subr; 
      } 

HTML

<input type="submit" value="Submit" id="btnSubmit" onclick="validateEverything(event)"> 

JSFIDDLE

Смежные вопросы