Javascript-форум - .click() по элементам

Javascript-форум (https://javascript.ru/forum/)

- jQuery (https://javascript.ru/forum/jquery/)

- - .click() по элементам (https://javascript.ru/forum/jquery/71388-click-po-ehlementam.html)

.click() по элементам

Почему не работает .click() на элементе. Пробегаюсь по списку через цикл, нахожу нужный, ставлю ему click, но сам клик не срабатывает. Через debugger и напрямую (без цикла) все отлично работает

Nikolay37,
где код?

Цитата:

Сообщение от рони (Сообщение 470094)

Nikolay37,
где код?

let baseName = "apple,pineapple,translate".split(',') 
let i=0 
let n=0 
start() 
function start(){ 
for(i;i<document.getElementsByClassName('name').length;i++){ 
if(document.getElementsByClassName('name')[i].innerText == baseName[n]){ 
document.getElementsByClassName('name')[i].click() 
} 

if(n < baseName.length -1){ 
i=0 
n++ 
start() 
} 
} 
}

Nikolay37, пример нужен полный, с хтмэлем...

Цитата:

Сообщение от ksa (Сообщение 470105)

Nikolay37, пример нужен полный, с хтмэлем...

Там авторизация через steam нужна, я сомневаюсь что вы так заморачиваться будете, или есть аккаунт от steam? Вообще с чем может быть связано?

Цитата:

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

Там авторизация через steam нужна

Пример сам сделай тестовый и тут выложи. Какая тут авторизация? :D

Цитата:

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

Вообще с чем может быть связано?

Вот на примере как раз все видно будет. ;)

Nikolay37, пока не понятно зачем применяется рекурсивный вызов функции вместо обычного цикла...
Так же трижды используется

document.getElementsByClassName('name')

:-? start плохое имя для функции, может переименовать

Цитата:

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

У вас в логике работы дырень.
Текущий код будет проверять только первый элемент выборки на соответствие его контента значению эл. массива basename.
Попробуйте так:

let baseName = "apple,pineapple,translate".split(',')
let i = 0
let n = 0
let nodes = document.getElementsByClassName('name');
console.log('Найдено элементов: ' + nodes.length);
start()

function start() {
    for (i; i < nodes.length; i++) {
        console.log(nodes[i].innerText + ' == ' + baseName[n] + ' -> ' +
            (nodes[i].innerText == baseName[n] ? 'true' : 'false'));
        if (nodes[i].innerText == baseName[n]) {
            console.log('CLICK');
            nodes[i].click();
            break; //Если нужно кликнуть только по одному элементу
        }
    }
    if (n < baseName.length - 1) {
        i = 0
        n++
        console.log('Restart');
        start()
    }

}

Цитата:

Сообщение от ksa (Сообщение 470108)

document.getElementsByClassName('name')

Рекурсия нужна для того, чтобы перечислять мои элементы из baseName
"Так же трижды используется"

document.getElementsByClassName('name')

[/quote]

Ну я могу в целом это в переменную записать, смысл не изменится

Цитата:

Сообщение от рони (Сообщение 470109)

:-? start плохое имя для функции, может переименовать

Увы, но это тоже роли не играет

Цитата:

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

Ну я могу в целом это в переменную записать, смысл не изменится

Изменится.

Цитата:

Сообщение от Nexus (Сообщение 470110)

let baseName = "apple,pineapple,translate".split(',')
let i = 0
let n = 0
let nodes = document.getElementsByClassName('name');
console.log('Найдено элементов: ' + nodes.length);
start()

function start() {
    for (i; i < nodes.length; i++) {
        console.log(nodes[i].innerText + ' == ' + baseName[n] + ' -> ' +
            (nodes[i].innerText == baseName[n] ? 'true' : 'false'));
        if (nodes[i].innerText == baseName[n]) {
            console.log('CLICK');
            nodes[i].click();
            break; //Если нужно кликнуть только по одному элементу
        }
    }
    if (n < baseName.length - 1) {
        i = 0
        n++
        console.log('Restart');
        start()
    }

}

В логике все хорошо, поскольку нужно проверить несколько элементов. С break скрипт начинает отлично работать, но это не то что нужно, поскольку надо кликнуть по нескольким элементам.

Кстати прошу заметить, ваш код тоже не работает, если убрать оттуда break

Цитата:

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

В логике все хорошо, поскольку нужно проверить несколько элементов.

let baseName = "apple,pineapple,translate".split(',')
let i = 0
let n = 0

function start() {
    for (i; i < document.getElementsByClassName('name').length; i++) {
        if (document.getElementsByClassName('name')[i].innerText == baseName[n]) {
            document.getElementsByClassName('name')[i].click()
        }

        if (n < baseName.length - 1) {
            i = 0
            n++
            start()
        }
    }
}

Что тут хорошего?
Вы пытаетесь в 6-й строке пробежаться по всем элементам с классом "name", но сразу же в конце первой итерации вызываете эту функцию вновь сбрасывая счетчик "i" и инкрементируя значение "n". Т.е. при втором вызове этой функции проверяться будет снова первый элемент с классом "name", но уже искомое значение будет другим.
После того, как счетчик "n" превысит baseName.length продолжат выполняться предыдущие циклы. Они будут проверять соответствие контента элементов (начиная со второго и до конца) с классом "name", но т.к. n==baseName.length, то искать циклы будут элемент, чей контент равен null. Т.е. условие для элементов с индексом > 1 никогда не выполнится, поскольку строка никогда не будет равна null (равна !== эквивалентна).

Upd. [][1]===undefined, т.е. в тексте выше "null" читайте как "undefined", но сути не меняет.

Цитата:

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

Кстати прошу заметить, ваш код тоже не работает, если убрать оттуда break

Смотрите консоль, там отображается исчерпывающая информация.
Пофиксить баг труда не составит.

Цитата:

Сообщение от Nexus (Сообщение 470135)

Прошу прощенья, ошибся чутка, вот правильный код, который я использовал. Сначала не увидел ошибки:

let baseName = "apple,pineapple,translate".split(',')
let i = 0
let n = 0

function start() {
    for (i; i < document.getElementsByClassName('name').length; i++) {
        if (document.getElementsByClassName('name')[i].innerText == baseName[n]) {
            document.getElementsByClassName('name')[i].click()
        }
}

        if (n < baseName.length - 1) {
            i = 0
            n++
            start()
        }
}

Если открыть debugger в начале исполнения фун-и, то она работает хорошо и клик по элементу срабатывает

Цитата:

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

Рекурсия нужна для того, чтобы перечислять мои элементы из baseName

Для "перечисления" используют циклы. ;)

Цитата:

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

вот правильный код

Полный пример с тегами хтмл мы так и не увидим?

Цитата:

Сообщение от ksa (Сообщение 470148)

Полный пример с тегами хтмл мы так и не увидим?

<div id="items">
<div class="scrollbar">
<div class="item" data-error="" data-bot_id="37" data-price="5336" data-asset_id="12677286778"  data-market_hash_name="M4A1-S | Cyrex (Field-Tested)" data-name="m4a1-s | cyrex (field-tested)">
<a href="steam://rungame/730/76561202255233023/+csgo_econ_action_preview%20S76561198418960881A12677286778D13862166415325500362" class="btn-inspect">Inspect</a><span class="price">5,336</span>
<div class="image"><img src="https://steamcommunity-a.akamaihd.net/economy/image/-9a81dlWLwJ2UUGcVs_nsVtzdOEdtWwKGZZLQHTxDZ7I56KU0Zwwo4NUX4oFJZEHLbXH5ApeO4YmlhxYQknCRvCo04DEVlxkKgpou-6kejhz2v_Nfz5H_uO1gb-Gw_alIITSj3lU8Pp8j-3I4IG721Hh_UM_YmilJY7DegI4Nw7Y8we4wO-9hJG76pzImHsy7ygh7HyMnAv330-QA3A95Q"/></div>
<span class="name">M4A1-S | Cyrex (Field-Tested)</span>
</div>
<div class="item" data-error="" data-bot_id="37" data-price="26460" data-asset_id="12677286746"  data-market_hash_name="AK-47 | Fuel Injector (Well-Worn)" data-name="ak-47 | fuel injector (well-worn)">
<a href="steam://rungame/730/76561202255233023/+csgo_econ_action_preview%20S76561198418960881A12677286746D9559139697008051705" class="btn-inspect">Inspect</a><span class="price">26,460</span>
<div class="image"><img src="https://steamcommunity-a.akamaihd.net/economy/image/-9a81dlWLwJ2UUGcVs_nsVtzdOEdtWwKGZZLQHTxDZ7I56KU0Zwwo4NUX4oFJZEHLbXH5ApeO4YmlhxYQknCRvCo04DEVlxkKgpot7HxfDhnwMzJemkV08-jhIWZlP_1IbzUklRc7cF4n-SPpIr33gS1rkJqYGD7J4GQcQY5aFCG-lHrlO650JLv6ZzMziA2vXMgtmGdwULg8tCd0w"/></div>
<span class="name">AK-47 | Fuel Injector (Well-Worn)</span>
</div>
<div class="item" data-error="" data-bot_id="37" data-price="6090" data-asset_id="12677215278"  data-market_hash_name="M4A4 | 龍王 (Dragon King) (Minimal Wear)" data-name="m4a4 | 龍王 (dragon king) (minimal wear)">
<a href="steam://rungame/730/76561202255233023/+csgo_econ_action_preview%20S76561198418960881A12677215278D7254987710742629388" class="btn-inspect">Inspect</a><span class="price">6,090</span>
<div class="image"><img src="https://steamcommunity-a.akamaihd.net/economy/image/-9a81dlWLwJ2UUGcVs_nsVtzdOEdtWwKGZZLQHTxDZ7I56KU0Zwwo4NUX4oFJZEHLbXH5ApeO4YmlhxYQknCRvCo04DEVlxkKgpou-6kejhjxszFJTwW0924l4WYg-X1P4Tdn2xZ_ItyiO2Yot-n3gztrUduMW6icdWcc1RqM1HR_FfswLu6gZe4tZrNmiBkpGB8smM7Zio1"/></div>
<span class="name">M4A4 | 龍王 (Dragon King) (Minimal Wear)</span>
</div>
<div class="item" data-error="" data-bot_id="37" data-price="79700" data-asset_id="12677151027"  data-market_hash_name="★ Bayonet | Forest DDPAT (Battle-Scarred)" data-name="★ bayonet | forest ddpat (battle-scarred)">
<a href="steam://rungame/730/76561202255233023/+csgo_econ_action_preview%20S76561198418960881A12677151027D9430682923177156928" class="btn-inspect">Inspect</a><span class="price">79,700</span>
<div class="image"><img src="https://steamcommunity-a.akamaihd.net/economy/image/-9a81dlWLwJ2UUGcVs_nsVtzdOEdtWwKGZZLQHTxDZ7I56KU0Zwwo4NUX4oFJZEHLbXH5ApeO4YmlhxYQknCRvCo04DEVlxkKgpotLu8JAllx8zAaAJG6My3gL-DkvbiKvXXz29XucMoibnArY6s2AXn8kRvZW76LYWSJFdoNwrV_1e2yezuhJbqot2Xnvb67xpg"/></div>
<span class="name">★ Bayonet | Forest DDPAT (Battle-Scarred)</span>
</div>
<div class="item" data-error="" data-bot_id="37" data-price="5317" data-asset_id="12676401658"  data-market_hash_name="AK-47 | Orbit Mk01 (Minimal Wear)" data-name="ak-47 | orbit mk01 (minimal wear)">
<a href="steam://rungame/730/76561202255233023/+csgo_econ_action_preview%20S76561198418960881A12676401658D9261165439988559703" class="btn-inspect">Inspect</a><span class="price">5,317</span>
<div class="image"><img src="https://steamcommunity-a.akamaihd.net/economy/image/-9a81dlWLwJ2UUGcVs_nsVtzdOEdtWwKGZZLQHTxDZ7I56KU0Zwwo4NUX4oFJZEHLbXH5ApeO4YmlhxYQknCRvCo04DEVlxkKgpot7HxfDhnwMzJegJB49C5mpnbxsjmNr_ummJW4NE_iL-ZrYj03wLl_hFqNm71cteWdlA5Zl2F-FG-yO_r0cW4uMnMynFl6T5iuyjnxSwaOw"/></div>
<span class="name">AK-47 | Orbit Mk01 (Minimal Wear)</span>
</div>
<div class="item" data-error="" data-bot_id="37" data-price="52140" data-asset_id="12676164519"  data-market_hash_name="★ Shadow Daggers | Scorched (Field-Tested)" data-name="★ shadow daggers | scorched (field-tested)">
<a href="steam://rungame/730/76561202255233023/+csgo_econ_action_preview%20S76561198418960881A12676164519D16161770010107986788" class="btn-inspect">Inspect</a><span class="price">52,140</span>
<div class="image"><img src="https://steamcommunity-a.akamaihd.net/economy/image/-9a81dlWLwJ2UUGcVs_nsVtzdOEdtWwKGZZLQHTxDZ7I56KU0Zwwo4NUX4oFJZEHLbXH5ApeO4YmlhxYQknCRvCo04DEVlxkKgpovbSsLQJfw-bbeQJR_OOylZCbm_LLPr7Vn35cppwl2-vAot6n0Aa3_Uo_amv3dYKcewRsYl7V_QDql-fu15fv75TPznF9-n515DsDCZ4"/></div>
<span class="name">★ Shadow Daggers | Scorched (Field-Tested)</span>
</div>
<div class="item" data-error="" data-bot_id="37" data-price="27660" data-asset_id="12676144964"  data-market_hash_name="AK-47 | Case Hardened (Field-Tested)" data-name="ak-47 | case hardened (field-tested)">
<a href="steam://rungame/730/76561202255233023/+csgo_econ_action_preview%20S76561198418960881A12676144964D876729287817217943" class="btn-inspect">Inspect</a><span class="price">27,660</span>
<div class="image"><img src="https://steamcommunity-a.akamaihd.net/economy/image/-9a81dlWLwJ2UUGcVs_nsVtzdOEdtWwKGZZLQHTxDZ7I56KU0Zwwo4NUX4oFJZEHLbXH5ApeO4YmlhxYQknCRvCo04DEVlxkKgpot7HxfDhhwszHeDFH6OO7kYSCgvq6Yu-EwzsIuZIj3uiY99WmiwGx_kc9Zjr6JYHBIwM5MFHX-Fi9w-u-1Ij84soNG54bQA"/></div>
<span class="name">AK-47 | Case Hardened (Field-Tested)</span>
</div>
<div class="item" data-error="" data-bot_id="37" data-price="23420" data-asset_id="12676074732"  data-market_hash_name="StatTrak™ AWP | Fever Dream (Field-Tested)" data-name="stattrak™ awp | fever dream (field-tested)">

В let baseName = "StatTrak™ AWP | Fever Dream (Field-Tested)".split(',') Любые из имен. (В данном случае беру только 1, но по сути нужно несколько)

Этого достаточно или вообще весь код?

Nikolay37, у тебя извращенное понятие тестового примера. :(

Убери из этого фарша не нужную информацию.

Цитата:

Сообщение от ksa (Сообщение 470193)

Nikolay37, у тебя извращенное понятие тестового примера. :(

Убери из этого фарша не нужную информацию.

https://jsfiddle.net/kwrcao7u/

Цитата:

Сообщение от ksa (Сообщение 470193)

Nikolay37, у тебя извращенное понятие тестового примера. :(

Убери из этого фарша не нужную информацию.

<div id="items">
<div class="scrollbar">
<div class="item">
<span class="name">★ M9 Bayonet | Bright Water (Factory New)</span>
</div>
<div class="item">
<span class="name">★ Falchion Knife | Blue Steel (Field-Tested)</span>
</div>
<div class="item">
<span class="name">AWP | Man-o'-war (Minimal Wear)</span>
</div>
<div class="item">
<span class="name">AWP | Man-o'-war (Minimal Wear)</span>
</div>
<div class="item">
<span class="name">AK-47 | Case Hardened (Field-Tested)</span>
</div>

Цитата:

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

let baseName = "apple,pineapple,translate".split(',')

В последнем примере я не вижу этих классов... :no:

Или ты по тексту ищешь чего?

Нужно клацать по элементам с указанным текстом?

Цитата:

Сообщение от ksa (Сообщение 470199)

Да, текст разный.
В общем проблему решили с помощью forEach. Там клацаем по названиям аттрибутов

baseName.forEach(function(i, e, arr){
$('div.item[data-market_hash_name="'+i+'"]').click();
});

Nikolay37, вот так выглядят тестовые примеры. ;)

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='https://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){
	$('.name').click(function(){
		alert(this.innerHTML);
	});
	var arr=[
		'AK-47 | Case Hardened (Field-Tested)',
		'AWP | Man-o\'-war (Minimal Wear)'
	];
	var o=document.querySelectorAll('.name');
	for (var i=0; i<arr.length; i++) {
		for (var j=0; j<o.length; j++) {
			if (o[j].innerHTML==arr[i]) {
				o[j].click();
			};
		};
	};
});
</script>
</head>
<body>
<div id="items">
	<div class="scrollbar">
		<div class="item">
			<span class="name">★ M9 Bayonet | Bright Water (Factory New)</span>
		</div>
		<div class="item">
			<span class="name">★ Falchion Knife | Blue Steel (Field-Tested)</span>
		</div>
		<div class="item">
			<span class="name">AWP | Man-o'-war (Minimal Wear)</span>
		</div>
		<div class="item">
			<span class="name">AWP | Man-o'-war (Minimal Wear)</span>
		</div>
		<div class="item">
			<span class="name">AK-47 | Case Hardened (Field-Tested)</span>
		</div>
	</div>
</div>
</body>
</html>