个人中心
gpt4 book ai didi

JavaScript 选择器

转载 作者：行者123 更新时间：2023-12-03 00:36:55 24 4
gpt4 key购买 nike

我必须制作一个 html 页面，我可以从列表中随机选择一个人(这是我的类(class))。

我这样做了，但现在我已经标记并忽略了随机选择器中缺席的人。

就像电子注册表一样。

如果您单击该按钮，它应该从列表中删除该名称并禁用该按钮。

我的问题是我无法从列表中删除特定元素。

它会是这样的:

不删除字符串的数量，而不是删除与按钮相同的实际字符串。

我对匈牙利评论感到非常抱歉，但它主要是名字和一些对我来说的指导。

<body>
   <h1 align="center"> Random választó MÉG SZAR </h1>
   <div align="center">
      <div>
         <button type="randomEmber" onclick="randomEmber()">Random Ember	Kiválasztása</button>
         <input name="randomEmber" id="randomEmber" placeholder="Ne írj ide,el fog tűnni"> </input>
      </div>
      <br />
      <br />
      <br />
      Kik a hiányzók? <!-- ezt csináld meg -->
      <br />
      <br />
      <button onClick="this.disabled = true;Képes();" value="Képes"> Képes </button>
      <button onClick="this.disabled = true;Korsós();" value="Korsós"> Korsós </button>
      <button onClick="this.disabled = true;Lálóczki();" value="Lálóczki"> Lálóczki </button>
      <button onClick="this.disabled = true;Laukó();" value="Laukó"> Laukó </button>
      <button onClick="this.disabled = true;Neményi();" value="Neményi"> Neményi </button> <!-- ribait törli -->
      <button onClick="this.disabled = true;Pálya();" value="Pálya"> Pálya </button>
      <button onClick="this.disabled = true;Panajoth();" value="Panajoth"> Panajoth </button>
      <button onClick="this.disabled = true;Prepszl();" value="Prepszl"> Prepszl </button>
      <br />
      <br />
      <button onClick="this.disabled = true;Ribai();" value="Ribai"> Ribai </button> <!-- sipkát törli -->
      <button onClick="this.disabled = true;Sipka();" value="Sipka"> Sipka </button> <!-- Sipost törli -->
      <button onClick="this.disabled = true;Sipos();" value="Sipos"> Sipos </button> <!-- Stírt törli -->
      <button onClick="this.disabled = true;Stír();" value="Stír"> Stír </button> <!-- Szombatit törli -->
      <button onClick="this.disabled = true;Szombati();" value="Szombati"> Szombati </button> <!-- Tóthot törli -->
      <button onClick="this.disabled = true;Tóth();" value="Tóth"> Tóth </button> <!-- Vasst törli -->
      <button onClick="this.disabled = true;Vass();" value="Vass"> Vass </button> <!-- Zsolnait törli -->
      <button onClick="this.disabled = true;Zsolnai();" value="Zsolnai"> Zsolnai </button> <!-- ez jo -->
   </div>
   <br />
   <p align="center">Névsor:</p>
   <br />
   <p id="demo" align="center"></p>
   <script>
      var ember = Array(
      	"Képes",
      	"Korsós",
      	"Lálóczki",
      	"Laukó",
      	"Neményi",
      	"Pálya",
      	"Panajoth",
      	"Prepszl",
      	"Ribai",
      	"Sipka",
      	"Sipos",
      	"Stír",
      	"Szombati",
      	"Tóth",
      	"Vass",
      	"Zsolnai"
      );
      
      function randomEmber() {
      	var randomEmber = ember[Math.floor(Math.random() * ember.length)];
      	document.getElementById('randomEmber').value = randomEmber;
      }
      
      document.getElementById("demo").innerHTML = ember;
      
      // nem elegans de jo ez
      
      function Képes() {
        	ember.shift();
      hianyzo.push("Képes");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Korsós() {
        	ember.splice(1,1);
      hianyzo.push("Korsós");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Lálóczki() {
        	ember.splice(2,1);
      hianyzo.push("Lálóczki");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Laukó() {
        	ember.splice(3,1);
      hianyzo.push("Laukó");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Neményi() {
        	ember.splice(4,1);
      hianyzo.push("Neményi");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Pálya() {
        	ember.splice(5,1);
      hianyzo.push("Pálya");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Panajoth() {
        	ember.splice(6,1);
      hianyzo.push("Panajoth");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Prepszl() {
        	ember.splice(7,1);
      hianyzo.push("Prepszl");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Ribai() {
        	ember.splice(9,1);
      hianyzo.push("Ribai");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Sipka() {
        	ember.splice(10,1);
      hianyzo.push("Sipka");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Sipos() {
        	ember.splice(11,1);
      hianyzo.push("Sipos");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Stír() {
        	ember.splice(12,1);
      hianyzo.push("Stír");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Szombati() {
        	ember.splice(13,1);
      hianyzo.push("Szombati");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Tóth() {
        	ember.splice(14,1);
      hianyzo.push("Tóth");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Vass() {
        	ember.splice(15,1);
      hianyzo.push("Vass");
        	document.getElementById("demo").innerHTML = ember;
      }
      
      function Zsolnai() {
        	ember.pop();
      hianyzo.push("Zsolnai");
        	document.getElementById("demo").innerHTML = ember;
      }
      // nem elegans de jo ez
      
      // csinalj minden embernek egay myfunvtion2...t-ot ember.slice(0,x)  el
      
      if (randomEmber == null){
       	alert("Nincs senki ma az órán????");
      }
      
       document.getElementById("demo").innerHTML = txt;
      
      // TUDOTT HIBÁK:
      // ha nincs egy név se,akk undefiniedet ír ki az input
      
   </script>
   <br />
   <p align="center"> Hiányzók: </p>
   <script>
      var hianyzo = Array(
      );
      
      document.getElementById("hianyzo").innerHTML = hianyzo;
   </script>
</body>

最佳答案

您的代码向我表明您是新手，因此我不会对您的代码进行大规模修改。您应该知道，您不需要创建单独的函数来从数组中删除单独的名称。

您只需要一个:

  function remove(name) {
   ember.splice( ember.indexOf(name), 1);
   document.getElementById("demo").innerHTML = ember;
  }

通过使用indexOf，您可以在数组中搜索传入名称的正确索引。

remove('Képes')

上面的代码将在数组中搜索 Képes 并删除该名称。然后它将在演示区域中重新创建数组。

在评论中，您还指出需要将已删除的用户添加到 hianyo。以下更改将允许您执行此操作:

function remove(name) {
  ember.splice(ember.indexOf(name), 1); //remove from ember
  hianyzo.push(name); //add to hianyzo
  document.getElementById("demo").innerHTML = ember; // show updated ember
  document.getElementById("demo2").innerHTML = hianyzo; // show updated hianyzo
}

在上面的任何时候，我们从 ember 中删除一个名称，我们都会将其添加到 hianyzo，然后显示两个数组的更改。

除了该更改之外，我还更新了您的随机函数:

function randomEmber() {
if(ember.length === 0) { alert("Nincs senki ma az órán????"); return; } 
//if the array is empty, alert the user and stop.
// otherwise...
var e = ember[Math.floor(Math.random() * ember.length)]; //get random user
document.getElementById("randomEmber").value = e; //show random user
}

上面只是检查您是否删除了所有同学。如果有，它会提醒用户并停止该功能继续。这将使 undefined 不会出现在您的 randomEmber 框中。 

var ember = Array("Képes", "Korsós", "Lálóczki", "Laukó", "Neményi", "Pálya", "Panajoth", "Prepszl", "Ribai", "Sipka", "Sipos", "Stír", "Szombati", "Tóth", "Vass", "Zsolnai"), hianyzo = [];

function randomEmber() {
  if(ember.length === 0) { alert("Nincs senki ma az órán????"); return; } //if the array is empty, alert the user and stop.
  var e = ember[Math.floor(Math.random() * ember.length)]; //get random user
  document.getElementById("randomEmber").value = e; //show random user
}

function remove(name) {
  ember.splice(ember.indexOf(name), 1); //remove from ember
  hianyzo.push(name); //add to hianyzo
  document.getElementById("demo").innerHTML = ember; // show updated ember
  document.getElementById("demo2").innerHTML = hianyzo; // show updated hianyzo
}

document.getElementById("demo2").innerHTML = hianyzo; // show initial hianyzo
document.getElementById("demo").innerHTML = ember; //show initial ember
<h1 align="center"> Random választó MÉG SZAR </h1>
<div align="center">
  <div>
    <button type="randomEmber" onclick="randomEmber()">Random Ember	Kiválasztása</button>
    <input name="randomEmber" id="randomEmber" placeholder="Ne írj ide,el fog tűnni"> </input>
  </div>
  <br />
  <br />
  <br /> Kik a hiányzók?
  <!-- ezt csináld meg -->
  <br />
  <br />
  <button onClick="this.disabled = true;remove('Képes');" value="Képes"> Képes </button>
  <button onClick="this.disabled = true;remove('Korsós');" value="Korsós"> Korsós </button>
  <button onClick="this.disabled = true;remove('Lálóczki');" value="Lálóczki"> Lálóczki </button>
  <button onClick="this.disabled = true;remove('Laukó');" value="Laukó"> Laukó </button>
  <button onClick="this.disabled = true;remove('Neményi');" value="Neményi"> Neményi </button>
  <!-- ribait törli -->
  <button onClick="this.disabled = true;remove('Pálya');" value="Pálya"> Pálya </button>
  <button onClick="this.disabled = true;remove('Panajoth');" value="Panajoth"> Panajoth </button>
  <button onClick="this.disabled = true;remove('Prepszl');" value="Prepszl"> Prepszl </button>
  <br />
  <br />
  <button onClick="this.disabled = true;remove('Ribai');" value="Ribai"> Ribai </button>
  <!-- sipkát törli -->
  <button onClick="this.disabled = true;remove('Sipka');" value="Sipka"> Sipka </button>
  <!-- Sipost törli -->
  <button onClick="this.disabled = true;remove('Sipos');" value="Sipos"> Sipos </button>
  <!-- Stírt törli -->
  <button onClick="this.disabled = true;remove('Stír');" value="Stír"> Stír </button>
  <!-- Szombatit törli -->
  <button onClick="this.disabled = true;remove('Szombati');" value="Szombati"> Szombati </button>
  <!-- Tóthot törli -->
  <button onClick="this.disabled = true;remove('Tóth');" value="Tóth"> Tóth </button>
  <!-- Vasst törli -->
  <button onClick="this.disabled = true;remove('Vass');" value="Vass"> Vass </button>
  <!-- Zsolnait törli -->
  <button onClick="this.disabled = true;remove('Zsolnai');" value="Zsolnai"> Zsolnai </button>
  <!-- ez jo -->
</div>
<br />
<p align="center">Névsor:</p>
<br />
<p id="demo" align="center"></p>
<br />
<p align="center"> Hiányzók: </p>
<p id="demo2"></p>

关于JavaScript 选择器，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53622258/

24 4 0
文章推荐： javascript - 使用 socket.on 处理程序之外的数据
文章推荐： javascript - React-Native:如何将组件中的项目与另一个组件中的项目绑定(bind)？
文章推荐： javascript - jquery没有冲突错误不是函数
文章推荐： javascript - 如何将红色边框应用于其 href 出现在数组中的页面上的所有 元素？ (javascript)
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com