点击它移动文字

时间:2017-11-20 14:51:53

标签: javascript html text move

看不出什么是错的:使用这个应用程序,用户应该在框中写一些东西而不是弹出“Ideer”。这很有用。但是当你单击你写的单词时,它应该将Ideer(“ide-liste”)移动到Forkastet(“forkastet-liste”),然后返回。有些事情是错的,但我看不出来。你有人看到过吗?

//enkapsulering - struktur og JavaScript patterns
(function() {

  //HTML objects (deklarasjon)
  let leggTilTittel;
  let tittelBtn;
  let leggtilIde;
  let ideBtn;
  let ideTittel;
  let ideListe;
  let forkastetListe;
  //HTML objects slutter


  //Init functions
  const init = function() {

    const setHTMLObjects = function() {
      leggTilTittel = document.getElementById("legg-til-tittel");
      tittelBtn = document.getElementById("tittel-btn");
      leggTilIde = document.getElementById("legg-til-ide");
      ideBtn = document.getElementById("ide-btn");
      ideTittel = document.getElementById("ide-tittel");
      ideListe = document.getElementById("ide-liste");
      forkastetListe = document.getElementById("forkastet-liste");
    }();

    //Set events
    let setEvents = function() {
      tittelBtn.onclick = nyTittel;
      leggTilTittel.onclick = cleanIt;
      ideBtn.onclick = nyIde;
      leggTilIde.onclick = cleanItToo;
      //Selve ideen, forkastet ide
    }();
    //Set events

  }();
  //Init functions slutter

  //Application logic
  function nyTittel() {
    let nyttOrd = leggTilTittel.value;
    document.getElementById("ide-tittel").innerHTML = nyttOrd;
  }

  //Tømmer tekstboksen til tittel
  function cleanIt() {
    this.value = "";
  }


  //Output ideer
  function nyIde() {
    let nyIde = document.createElement("li");
    let nyIdeValue = document.createTextNode(leggTilIde.value);
    ideListe.appendChild(nyIdeValue);
    nyIde.onmousedown = flyttIde;
  }


  //Tømmer tekstboksen til ideer
  function cleanItToo() {
    this.value = "";
  }


  //Flytte til forkastet
  function flyttIde() {
    forkastetListe.appendChild(this);
    this.onmousedown = flyttTilbake;
    this.style.cssText += ("color:red;");

  }

  //Flytte tilbake
  function flyttTilbake() {
    ideListe.appendChild(this);
    this.onmousedown = flyttIde;
    this.style.cssText += ("color: white;");
  }

}()); //Slutt på den store function
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">


  <title>Idémyldring</title>

</head>

<body>

  <div id="alt">

    <!--Banner-->
    <h1>Idémyldring</h1>
    <!--Banner slutter-->

    <!--Legg til tittel-->
    <section id="tittel-section">
      <input id="legg-til-tittel" type="text" placeholder="... skriv inn tittel">
      <input id="tittel-btn" type="button" value="Legg til tittel">
    </section>
    <!--Legg til slutter-->

    <!--Legg til idé-->
    <section id="ide-section">
      <input id="legg-til-ide" type="text" placeholder="... skriv inn idé">
      <input id="ide-btn" type="button" value="Legg til idé">
    </section>
    <!--Legg til idé slutter-->

    <!--Bare en tittel-->
    <h2 id="ide-tittel">Tittel</h2>
    <!--Bare en tittel slutter-->

    <!--Tittel på idè-->
    <h3>Ideer</h3>

    <ul id="ide-liste"></ul>
    <!--Tittel på idè slutter-->

    <!--Tittel på forkastet-->
    <h3>Forkastet</h3>

    <ul id="forkastet-liste"></ul>
    <!--Tittel på forkastet slutter-->
  </div>

  <script src="main.js"></script>
</body>

</html>

0 个答案:

没有答案
相关问题