-1

I want to check background color with onclick method. But I couldn't make it. I use the query block within the function but it didn't work.

function elemanSurukleBasla(ev) {
    ev.dataTransfer.setData("text", ev.target.id);
    ID = ev.target.id;
    //alert(ev.target.id);
}

function elemanSuruklenior(ev) {
    ev.preventDefault();
}

function elemanBirakildi(ev) {
    ev.preventDefault();
    var veri = ev.dataTransfer.getData("text");
    ev.target.appendChild(document.getElementById(veri));
    var deniyoruz = "hedef" + ID;
}
function kontrol(){
   if (ev.target.id == deniyoruz) {
      document.getElementById("hedef" + ID).style.backgroundColor = "green";
   } else {
      document.getElementById(ev.target.id).style.backgroundColor = "red";
   }
 }
   

<div id="secenekler"><br>
  <div id="logo" class="soru_css" ondragover="elemanSuruklenior(event)" ondrop="elemanBirakildi(event)">
    <img id="1" name="secenek1" class="secenek1" src="https://www.w3.org/html/logo/downloads/HTML5_Logo_256.png" width="50" height="50" draggable="true" draggable="true" ondragstart="elemanSurukleBasla(event)" data-target="1">
  </div>
  <div id="logo" ondragover="elemanSuruklenior(event)" ondrop="elemanBirakildi(event)">
    <img id="2" name="secenek2" class="secenek2" src="https://vignette.wikia.nocookie.net/howtoprogram/images/a/a9/CSS3.png/revision/latest/scale-to-width-down/342?cb=20130422012035" width="50" height="50" draggable="true" ondragstart="elemanSurukleBasla(event)"  data-target="2" >
  </div>
  <div id="logo" ondragover="elemanSuruklenior(event)" ondrop="elemanBirakildi(event)"  >
    <img id="3" name="secenek3" class="secenek3" src="https://upload.wikimedia.org/wikipedia/commons/d/dc/Javascript-shield.png" width="50" height="50" draggable="true" ondragstart="elemanSurukleBasla(event)" data-target="3">
  </div>
</div>
<div id="sorular"> Sorular <br>
    <div id="hedef2" name="hedef1" ondragover="elemanSuruklenior(event)" ondrop="elemanBirakildi(event)"  data-target="2"></div> <br>
    <div id="hedef1" name="hedef2" ondragover="elemanSuruklenior(event)" ondrop="elemanBirakildi(event)"  data-target="1"></div> <br>
    <div id="hedef3" name="hedef3" ondragover="elemanSuruklenior(event)" ondrop="elemanBirakildi(event)"  data-target="3"></div><br>
</div>

<br>
 <button type="button" onclick="kontrol()">KONTROL</button>
<br>

How to check to background with button in JavaScript?

mayn
  • 29
  • 1
  • 4
  • Please [edit] your question to be on-topic: include a [mcve] that duplicates the problem. Questions seeking debugging help ("why isn't this code working?") must include: (1) the desired behavior, (2) a specific problem or error and (3) the shortest code necessary to reproduce it *in the question itself*. Please also see: [What topics can I ask about here?](//stackoverflow.com/help/on-topic), and [ask]. This question is about JavaScript/HTML/CSS, so you should consider using a [snippet](//blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets/). – Makyen Dec 10 '17 at 20:54
  • The background color of what? And how is your title related to the body of your Question. You appear to be asking about two different issues. Please [edit] your question to clarify. – Makyen Dec 10 '17 at 20:55
  • 1
    We'd like to help, but it's unclear what you're trying to get the background color of. You only have one `onclick` defined, which is on your ` – Makyen Dec 10 '17 at 21:24
  • Note that there are quite a few questions on Stack Overflow about [finding the background color](https://www.google.com/search?as_q=javascript+determine+"background+color"+site%3Astackoverflow.com). You might want to look through several of those to see if any of them cover your issue. – Makyen Dec 10 '17 at 21:33
  • Possible duplicate of [How to get the background color of an element using javascript?](https://stackoverflow.com/q/1887104) (see [this answer](https://stackoverflow.com/a/25991851/3773011) – Makyen Dec 10 '17 at 21:39
  • Sorry. I added kontrol() function. – mayn Dec 10 '17 at 21:40
  • Possible duplicate of [How do I detect the inherited background-color of an element using jQuery/JS?](https://stackoverflow.com/q/4259815) – Makyen Dec 10 '17 at 21:40
  • Thanks for adding/changing `kontrol()`. It's still not clear to me if you're asking us to debug what you have (which doesn't attempt to determine the background color, it just sets the color), or if you're really wanting to know how to determine the background color (see the linked duplicates). – Makyen Dec 10 '17 at 21:48
  • I've been searching for these before. I must to use pure JavaScript and be checked with the onclick method. – mayn Dec 10 '17 at 21:48
  • The background of *what* needs to be checked from within an `onclick` method? – Makyen Dec 10 '17 at 22:02
  • It being in an `onclick` shouldn't have anything to do with this, but is a convenient way to show doing it. I know that for *your* issue it needs to be within an `onclick`, but questions on Stack Overflow should be more limited than that. For instance, "How to find the background color of element X" is a separate question from "How do I execute something in an `onclick` listener". It's expected the reader can combine those two questions into figuring out "How to find the background color of element X in an `onclick` listener". If not, then they should try it & then ask a debugging question. – Makyen Dec 10 '17 at 22:05

1 Answers1

-1

Try:

<button onclick="myFunc()">Click</button>

In your js:

function myFunc(){
   return document.getElementById('myDiv').style.backgroundColor == 'black';
}
Lucas Rosenberger
  • 253
  • 1
  • 11