亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何在不立即執行“點擊”功能的情況下在我的文本區域中具有“必需”?

如何在不立即執行“點擊”功能的情況下在我的文本區域中具有“必需”?

慕少森 2022-09-16 20:54:46
我試著把我的文本區域放進去。但它不起作用,因為我的函數立即執行。我怎樣才能要求先填寫我的文本區域,而不立即執行點擊?這是我的代碼:requiredonclick="displayText()"網頁:<!DOCTYPE html><html>  <head>    <title>Word Counter</title>  </head>  <body>    <div id="input-page">      <h1>Word Counter</h1>      <form action="">        <textarea id="inputted-text" type="text" rows="22" cols="60"></textarea>        <br />      </form>      <button onclick="displayText()">COUNT</button>    </div>    <div id="count-page" style="display: none;">      <h1>Your Text:</h1>      <p id=display-user-text></p>      <div>         <h1 id="word-count">Count: </h1>      </div>    </div>  </body>  <script src="app.js"></script></html>腳本:const displayText = () => {  const inputPage = document.getElementById("input-page");  const countPage = document.getElementById("count-page");  inputPage.style.display = "none";  // get user's inputted text  const inputtedText = document.getElementById("inputted-text");  const inputtedTextValue = inputtedText.value;  // diplay user's inputted text  document.getElementById("display-user-text").innerText = inputtedTextValue;  countPage.style.display = "block";  console.log(countWords(inputtedTextValue));};const countWords = (str) => {  return str.split(" ").length;};const renderWordCount = () => {  document.getElementById("word-count") = wordCount;};獎勵:除了標題之外,我還可以顯示我的單詞計數,而不僅僅是在我的控制臺上顯示它?Count:
查看完整描述

1 回答

?
眼眸繁星

TA貢獻1873條經驗 獲得超9個贊

您希望系統在文本區域為空時發出警告。您可以通過將 If-else 條件表達式添加到代碼中來執行此操作。


const displayText = () => {

  const inputPage = document.getElementById("input-page");

  const countPage = document.getElementById("count-page");

  const inputtedText = document.getElementById("inputted-text");

  const inputtedTextValue = inputtedText.value;


  if (inputtedText.value !== "") { // normal flow will continue if the text-area is not empty

    inputPage.style.display = "none";

    document.getElementById("display-user-text").innerText = inputtedTextValue;

    countPage.style.display = "block";

  } else { // if the text-area is empty, it will issue a warning.

    alert("this area required")

  }


  console.log(countWords(inputtedTextValue));

};


const countWords = (str) => {

  return str.split(" ").length;

};


const renderWordCount = () => {

  document.getElementById("word-count") = wordCount;

};

<div id="input-page">

  <h1>Word Counter</h1>

  <form action="">

    <textarea id="inputted-text" type="text" rows="22" cols="60"></textarea>

    <br />

  </form>

  <button onclick="displayText()">COUNT</button>

</div>


<div id="count-page" style="display: none;">

  <h1>Your Text:</h1>

  <p id="display-user-text"></p>

  <div>

    <h1 id="word-count">Count: </h1>

  </div>

</div>


查看完整回答
反對 回復 2022-09-16
  • 1 回答
  • 0 關注
  • 106 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號