지금 내가 두 번 같은 견적을 인쇄하려면 코드를 막을 수있는 방법을 알아 내기 위해 노력하고 꽤 많은 시간 동안 버튼

Question

---

내가 가진을 클릭하면 두 번 같은 개체를 표시에서 제 기능을 중지하는 것을 시도하고있다.

또한 어레이의 모든 단일 개체가 인쇄 될 때 어떻게 든 재설정 할 수 있기를 바랍니다. 그래서 일단 당신이 모든 것을 끝내면 따옴표를 둘러 볼 수 있습니다.

이 내 코드의 필수적인 부분입니다 :

document.getElementById('loadQuote').addEventListener("click", printQuote, false); 

printQuote 기능은 단순히 내 배열에서 정보에 액세스 님의 정보가 포함되어

이

var randomObjectNumber = getRandomQuote(); 

var html = "<p class='quote'>" 
     + quotes[randomObjectNumber].quote + 
     "</p>"; 

document.getElementById('quote-box').innerHTML = html; 

가 하나의 임의 객체가 표시됩니다 eventListener를 클릭 할 때마다 :

function getRandomQuote() { 

var randomObjectNumber = Math.floor(Math.random() * quotes.length); 

return randomObjectNumber; 
} 

나는이 작업을 수행하는 방법에 대한 아이디어가 있지만 성공하지는 못했으나 시도해 보았습니다. 나는 각 객체에 부울 속성을 주려고했지만 실제로 printQuote 함수를 엉망으로 만들지 않고 각 속성에 부울 값을 할당하는 것처럼 보이지 않습니다.

다른 배열에 표시된 개체를 지정하려고했지만 동일한 문제가 발생했습니다.

표시된 개체를 조작하려고 할 때마다 모든 단일 개체가 변경되기 때문에 완전히 이해하지 못하는 몇 가지 개념이 eventListener 주위에있는 것처럼 느껴집니다.

{quote : "Darkness is merely the absence of light"} 

(나는 또한 다른 속성이 객체에 할당하지만 난 그들이 중복 될 것 제시 것 같은 느낌) :

이

는 배열의 일반적인 목적은 방법으로 모습입니다

누군가가 설명하거나 나에게이 문제를 해결하는 방법에 대한 힌트를 줄 수 있다면 나는 오랫동안 고심하고 있습니다.

몇 가지 힌트를 크게 높이세요!

좋은 하루 보내십시오.

세바스찬.

편집 : 모든 코드 :

onClicking 호출하여

//Let's developers create multiple eventListeners without being redundant. 
function onClicking (printFunction) { 
document.getElementById('loadQuote').addEventListener("click", printFunction, false); 
} 
onClicking(printColor); 
onClicking(printQuote); 

두 번 당신이 또는 addEventListener 두 번 추가되도록 클릭이 두 번 일어날 수 있도록 한 번 클릭을 의미합니다 : https://jsfiddle.net/fusqb7hz/

Answer 1

:

1. 것이다 별도의 배열을 만들고 여기에

   //Let's developers create multiple eventListeners without being redundant. 
   document.getElementById('loadQuote').addEventListener("click", function(){ 
       printColor(); 
       printQuote(); 
   }); 
   

   는 jsfiddle입니다 이미 사용했던 모든 인용문을 저장하십시오.

2. 초기 배열에서 따옴표를 제거하십시오.

3. 아직 초기 배열에 따옴표가 있는지 확인하고 그렇지 않은 경우 백업 배열에서 다시 가져옵니다.

Answer 2

문제는 두 번하여 addEventListener를 호출이다 2로 계산됩니다.

이를 위해 위의 코드를 변경

: 당신이 필요 기본적으로

https://jsfiddle.net/fusqb7hz/3/

Answer 3

가장 쉬운 방법은 견적 배열을 뒤섞어 하나씩 차례로 살펴 보는 것입니다. 이것은 당신에게 아직 보이지 않는 다음 인용문을줍니다. 필자가 원하지 않는 부분은이 셔플 러 (Fisher Yates 파생어)가 원래 견적 배열을 수정한다는 것입니다. 당신은 그것에 대해 상관하지 않을 수도 있습니다.

// -------------------------------- 
 
// A bunch of quotes 
 
// -------------------------------- 
 
var quotes = []; 
 
quotes.push({quote : "Darkness is merely the absence of light"}); 
 
quotes.push({quote : "quote 2"}); 
 
quotes.push({quote : "quote 3"}); 
 
quotes.push({quote : "quote 4"}); 
 
quotes.push({quote : "quote 5"}); 
 
// -------------------------------- 
 

 
// -------------------------------- 
 
// Your favorite array shuffle utility 
 
// -------------------------------- 
 
var shuffle = function(array) { 
 
    for (var i = array.length - 1; i > 0; i--) { 
 
    var j = Math.floor(Math.random() * (i + 1)); 
 
    var temp = array[i]; 
 
    array[i] = array[j]; 
 
    array[j] = temp; 
 
    } 
 
    return array; 
 
}; 
 
// -------------------------------- 
 

 
// -------------------------------- 
 
// construct a function to get a random unseen quote until 
 
// all quotes have been seen. Then reset... 
 
// -------------------------------- 
 
var getQuote = (function(quotes, shuffle){ 
 
    var current = 0; 
 

 
    var get = function(){ 
 
    if (!quotes || !quotes.length) { return ""; } 
 
    if (current >= quotes.length){ current = 0; } 
 
    if (current === 0){ 
 
     console.log("randomizing quotes..."); 
 
     shuffle(quotes); 
 
    } 
 
    return quotes[current++].quote; 
 
    }; 
 

 
    return get; 
 
})(quotes, shuffle); 
 
// -------------------------------- 
 

 
var printQuote = function(){ 
 
    document.getElementById('quote').innerText = getQuote(); 
 
}; 
 

 
document.getElementById('loadQuote').addEventListener("click", printQuote, false);

<div id="quote"></div> 
 
<button id="loadQuote">get quote</button>