第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

如何添加多個(gè)文本框來替換頁(yè)面上的文本

如何添加多個(gè)文本框來替換頁(yè)面上的文本

達(dá)令說 2022-06-09 16:11:35
我在使用 HTML 的頁(yè)面上有以下文本:“你好,我叫 HuggyBiscuit”我希望能夠添加框,例如更改“我的”和“Huggybiscuit”我可以使用以下代碼更改其中的 1 個(gè)(例如 HuggyBiscuit)<!DOCTYPE html><html><head></head><body>  <script type="text/javascript">  function myFunction(input){    var elementValue = input.value;    document.getElementById("test1").innerHTML = elementValue;  }  </script>    <input id="name" name="name" onkeyup = myFunction(this) type="text" value="HuggBiscuit">  <br>  Hello my name is <code id="test1">HuggBiscuit</code>  </body></html>但是當(dāng)我嘗試添加第二個(gè)框時(shí),它只是替換了第一個(gè)文本框的輸入。我嘗試為所有內(nèi)容添加單獨(dú)的 ID,但沒有任何東西可以讓我添加 2 個(gè)框來更改句子的單獨(dú)部分。2個(gè)盒子不工作的例子:<!DOCTYPE html><html><head></head><body>  <script type="text/javascript">  function myFunction(input){    var elementValue = input.value;    document.getElementById("test1","test2").innerHTML = elementValue;  }  </script>  <input id="name" name="name" onkeyup = myFunction(this) type="text" value="HuggBiscuit">  <input id="person" name="name" onkeyup = myFunction(this) type="text" value="my">  <br>  Hello <code id="test2">my</code> name is <code id="test1">HuggBiscuit</code></body></html>
查看完整描述

2 回答

?
元芳怎么了

TA貢獻(xiàn)1798條經(jīng)驗(yàn) 獲得超7個(gè)贊

Get document.getElementById("test1","test2"),只返回一個(gè)元素。您可以通過 id 從調(diào)用函數(shù)中進(jìn)行修改。


<!DOCTYPE html>

<html>


<head>

</head>


<body>

    <script type="text/javascript">

        function myFunction(input, id) {

            var elementValue = input.value;

            document.getElementById(id).innerHTML = elementValue;

        }

    </script>


    <input id="name" name="name" onkeyup="myFunction(this,'text2')" type="text" value="HuggBiscuit">

    <input id="person" name="name" onkeyup="myFunction(this, 'text1')" type="text" value="my">

    <br>

    Hello <code id="text1">my</code> name is <code id="text2">HuggBiscuit</code>


</body>


</html>


查看完整回答
反對(duì) 回復(fù) 2022-06-09
?
尚方寶劍之說

TA貢獻(xiàn)1788條經(jīng)驗(yàn) 獲得超4個(gè)贊

您可以將兩個(gè)參數(shù)傳遞給myFunction()


使用此技術(shù),您可以定位單個(gè)文本字段。


使用document.querySelectorAll()您可以自動(dòng)執(zhí)行此過程,以便每個(gè)輸入元素以一個(gè)具有相同參數(shù)(“名稱”、“目標(biāo)”等)的文本字段為目標(biāo)


<body>

  <script type="text/javascript">

  function myFunction(input,field){

    var elementValue = input.value;

    document.getElementById(field).innerHTML = elementValue;

  }


  </script>


  <input id="name" class="inputField" name="name" onkeyup = myFunction(this,'test1') type="text" value="HuggBiscuit">

  <input id="person" class="inputField" name="name" onkeyup = myFunction(this,'test2') type="text" value="my">

  <br>

  Hello <code id="test2">my</code> name is <code id="test1">HuggBiscuit</code>


</body>

這是創(chuàng)建多個(gè)輸入/文本字段連接的自動(dòng)化方式的簡(jiǎn)單代碼

<body>


  <input id="name" class="inputField" name="test1" type="text" value="HuggBiscuit">

  <input id="person" class="inputField" name="test2"  type="text" value="my">

  <input id="pet" class="inputField" name="test3"  type="text" value="parrot">

  <br>

  Hello <code id="test2">my</code> name is <code id="test1">HuggBiscuit</code> and i have a(n) <code id="test3">parrot</code>


</body>

<script type="text/javascript">


  document.querySelectorAll(".inputField")

  .forEach(x=>x.addEventListener("keyup",(e)=>{document.getElementById(e.target.name).innerText = e.target.value}))


</script>


查看完整回答
反對(duì) 回復(fù) 2022-06-09
  • 2 回答
  • 0 關(guān)注
  • 139 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)