Вопрос по jQuery, проверить, соответствует ли имя файла картинки и тогда выполнить, к
Доброго времени суток.
Было вот так <td class="featured column-featured" data-colname="Featured product">Yes</td> и определялось это вот так
var specific_post_edit_row = $( '#edit-' + id ),
specific_post_row = $( '#post-' + id ),
featured_product = false;
if( $( '.column-featured', specific_post_row ).text() == 'Yes' ) featured_product = true;
...
$( ':input[name="featured"]', specific_post_edit_row ).prop('checked', featured_product );
Я поменял логику и теперь за место слова Yes выводится картинка или несколько таковых (в зависимости от установленных чекбоксов). Как теперь определять состояние, т.е. при наличии картинки с определённым именем (к примеру hide.png) скрипт выполнял далее свои обязанности. P.S. Картинок в теге может быть и несколько, среди них надо обнаружить с определённым именем. Т.е. может быть и так <td class="featured column-featured" data-colname="Featured product"><img width="32" height="32" src="https://site.ru/vote.png"><img width="32" height="32" src="https://site.ru/hide.png"><img width="32" height="32" src="https://site.ru/imagestaff.png"></td> |
12345678, закладываться на содержимое элемента не самый лучший подход.
Есть ведь классы, всякие data-атрибуты... |
ksa
Спасибо что откликнулись. Класс добавить не проблема. Как будет в варианте с классом? |
12345678, вариант с картинкой и классом
<!DOCTYPE html>
<html>
<head>
<script src='https://code.jquery.com/jquery-latest.min.js'></script>
<!--
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
<script src='tmp.js'></script>
-->
<style>
</style>
<script>
$(_ => {
let o = $('.column-featured img[src$="vote.png"]')
if (o.length) alert('ok')
o = $('.column-featured')
if (o.hasClass('ok')) alert('ok')
})
</script>
</head>
<body>
<table>
<td class="featured column-featured ok" data-colname="Featured product">
<img width="32" height="32" src="https://site.ru/vote.png" />
<img width="32" height="32" src="https://site.ru/hide.png" />
<img width="32" height="32" src="https://site.ru/imagestaff.png" />
</td>
</body>
</html>
|
Я модернизировал исходный код согласно примеру
if( $( '.column-featured img[src$="vote.png"', specific_post_row ) ) featured_product = true; Но он почему то не работает.... |
Цитата:
Цитата:
|
Я попробовал так, но это также не помогло...
if( $( 'img[src$="vote.png"', specific_post_row ) ) featured_product = true;Галочка всё время в состоянии "поставлена" |
12345678,
скобку забыли!!! #5 |
рони
Где именно? |
Цитата:
img[src$="vote.png"] ;) |
Сделал, но всё равно не работает. Галочка так постоянно и отображается...
if( $( 'img[src$="vote.png"]', specific_post_row ) ) featured_product = true; |
Мозг просто взрывается, я не пойму в чём дело. Почему текст корректно определяет, в картинки в упор не видит и отсюда некорректно начинает работать....
|
Начнем с того что такой вариант давно не рекомендуют использовать...
Цитата:
У тебя получается вот что
<!DOCTYPE html>
<html>
<head>
<script src='https://code.jquery.com/jquery-latest.min.js'></script>
<!--
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
<script src='tmp.js'></script>
-->
<style>
</style>
<script>
$(_ => {
if ($('.bla-bla-bla')) alert('ok')
// хотя элемента такого нет
})
</script>
</head>
<body>
</body>
</html>
|
Цитата:
|
Цитата:
if( $( '.column-featured img[src$="vote.png"]', specific_post_row ) ) featured_product = true; Но не работает.... |
Не большой знаток jq, но что означает $ в src$?
На ваниле было бы просто
specific_post_row.querySelector('.column-featured img[src="vote.png"]')
|
Цитата:
|
Уф... добавил класс картинке и код подсмотрел, нагуглив по specific_post_row. Наконец то заработало как надо, радости нет предела :)
if( $( '.column-featured', specific_post_row ).find('img.classname').length !== 0 ) featured_product = true;
Спасибо всем за помощь. |
Цитата:
if( $( '.column-featured img[src$="vote.png"]', specific_post_row ).length ) featured_product = true; Это $( '.column-featured img[src$="vote.png"]', specific_post_row ) В любом случае будет объект и условие
if ({}) alert('ok')
Будет работать. |
Цитата:
<!DOCTYPE html>
<html>
<head>
<script src='https://code.jquery.com/jquery-latest.min.js'></script>
<!--
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
<script src='tmp.js'></script>
-->
<style>
</style>
<script>
$(_ => {
if ($('.bla-bla-bla')) alert('ok')
if (document.querySelector('.bla-bla-bla')) {
alert('ok')
} else {
alert('no')
}
})
</script>
</head>
<body>
</body>
</html>
Сейчас JS хорошо продвинулся. И надобность в jQuery, наверное, начинает утихать... |
voraa, но аналоги работают одинаково. ;)
<!DOCTYPE html>
<html>
<head>
<script src='https://code.jquery.com/jquery-latest.min.js'></script>
<!--
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
<script src='tmp.js'></script>
-->
<style>
</style>
<script>
$(_ => {
if ($('.bla-bla-bla')) alert('ok')
if (document.querySelectorAll('.bla-bla-bla')) {
alert('ok')
} else {
alert('no')
}
})
</script>
</head>
<body>
</body>
</html>
|
| Часовой пояс GMT +3, время: 22:00. |