Форум

Beegun · #1 (**permalink**) 08.09.2015, 19:51

И снова здравствуйте. К делу. Есть несколько изображений

<table id="blocks_table">
	<tr>
		<td><img class="menu_block" alt="Камень" src=/constructor/blocks/stone.png></td>
		<td><img class="menu_block" alt="Земля" src=/constructor/blocks/dirt.png></td>
		<td><a href="#"></a></td>
	</tr>
</table>

Достаю значение src с помощью JQuery

$(document).ready(function(){
$(".menu_block").click(function(){
var src = $(this).attr('src');
$(block_id).text(src);
});
});

теперь нужно чтобы в строке

elem.style.backgroundImage = "src";

был src из переменной

Помогите пожалуйста. Я в js нуб полный, а объяснить некому.

forwardonly2015 · #2 (**permalink**) 08.09.2015, 22:17

<table id="blocks_table">
    <tr>
        <td><img class="menu_block" alt="Камень" src="/constructor/blocks/stone.png"></td>
        <td><img class="menu_block" alt="Земля" src="/constructor/blocks/dirt.png"></td>
        <td><a href="#"></a></td>
    </tr>
</table>
<script>
show=function(){alert(this.src)}
;[].forEach.call(document.querySelectorAll(".menu_block"), function(block){
   block.onclick=show
})
</script>

Beegun · #3 (**permalink**) 08.09.2015, 22:29

forwardonly2015, Можете объяснить слегка, как его использовать?

рони · #4 (**permalink**) 08.09.2015, 22:31

Сообщение от Beegun

elem.style.backgroundImage

а кто elem?

Beegun · #5 (**permalink**) 08.09.2015, 22:39

var elem = document.getElementById(obj_id);
Здесь другая таблица с пустыми ячейками

forwardonly2015 · #6 (**permalink**) 08.09.2015, 22:43

Сообщение от Beegun

Можете объяснить слегка, как его использовать?

Пиши в ф-цию show=function(){alert(this.src)} вместо alert ту логитку, которая использует this.src, я хз, что у тебя там "предусмотрено". Я показал тебе как выдрать то что ты хотел, делай с этим значением то что тебе надо.

forwardonly2015 · #7 (**permalink**) 08.09.2015, 23:05

Вот так примерно

<body>
<table id="blocks_table">
    <tr>
        <td><img class="menu_block" alt="Камень" src="http://javascript.ru/forum/images/smilies/laugh.gif"></td>
        <td><img class="menu_block" alt="Земля" src="http://javascript.ru/forum/images/smilies/smile.gif"></td>
        <td><a href="#"></a></td>
    </tr>
</table>
<div id="element" style="border: 1px solid black; width: 20px; height: 20px"></element>
<script>
paste=function(){element.style.backgroundImage="url("+this.src+")"}
;[].forEach.call(document.querySelectorAll(".menu_block"), function(block){
   block.onclick=paste
})
</script>
</body>

Beegun · #8 (**permalink**) 08.09.2015, 23:15

Заработало, только не в ту сторону. Сейчас я нажимаю на ячейку в пустой таблице, а потом на картинку, тогда ячейка закрашивается, а нужно чтобы после нажатия на картинку переменная получала ее срц и после этого при нажатии на пустую ячейку ее фон принимал значение переменной. Такая вот раскраска. Придумать придумал, а реализовать никак ) Будь добр растолкуй пожалуйста)

forwardonly2015 · #9 (**permalink**) 08.09.2015, 23:27

может так?

<body>
<table id="blocks_table">
    <tr>
        <td><img class="menu_block" alt="Камень" src="http://javascript.ru/forum/images/smilies/laugh.gif"></td>
        <td><img class="menu_block" alt="Земля" src="http://javascript.ru/forum/images/smilies/smile.gif"></td>
        <td><a href="#"></a></td>
    </tr>
</table>
<div id="element" style="border: 1px solid black; width: 20px; height: 20px"></element>
<script>

tmp="http://javascript.ru/forum/images/smilies/angry.gif"

element.onclick=function(){element.style.backgroundImage="url("+tmp+")"}
paste=function(){tmp=this.src}
;[].forEach.call(document.querySelectorAll(".menu_block"), function(block){
   block.onclick=paste
})
</script>
</body>

Beegun · #10 (**permalink**) 08.09.2015, 23:43

не работает

function func(obj_id) {
    var elem = document.getElementById(obj_id);
document.getElementsByClassName('.menu_block').onclick = function(){
		var src = this.src
	} 
	elem.style.backgroundImage="url("+src+")"; };

Вот посмотри, нужно чтобы переменная src получила значение this.src но я тупой

Форум

Справочник

Discord чат

Курсы javascript