Код HTML:
<a id='link1' href='#' name='john' >test</a>
<br/><br/>
<a id='link2' href='#' name='john' onclick="showName();">test</a>
<br/><br/>
<a id='link3' href='#' name='smith' onclick="showName();">test</a>
Код JScript:
$(function()
{
$('#link1').on('click', function(){
alert($(this).attr('name'));
});
}
)
function showName()
{
alert($(this).attr('name'));
}
И скрипка: http://jsfiddle.net/eS7Mv/7/
Почему вторая и третья ссылки не работают? Кстати, мне нужно использовать именованную функцию по некоторым причинам. Поэтому я знаю, что:
$('a').on('click', function(){
alert($(this).attr('name'));
});
Или
$('.TargetClass').on('click', function(){
alert($(this).attr('name'));
});
Как-то решит проблему, но мне нужно работать с именованными функциями и получить доступ к атрибутам гиперссылки.
используйте этот код
html-код
<a id='link1' href='#' name='john' >test</a><br/><br/>
<a id='link2' href='#' name='john' onclick="showName(this);">test</a><br/><br/>
<a id='link3' href='#'name='smith'onclick="showName(this);">test</a>
Код jquery -
function showName(obj)
{
alert($(obj).attr('name'));
}
попробуй это
Демо-скрипт http://jsfiddle.net/eS7Mv/18/
<a id='link1' href='#' name='john' >test</a>
<br/><br/>
<a id='link2' href='#' name='john' onclick="showName(this);">test</a>
<br/><br/>
<a id='link3' href='#' name='smith' onclick="showName(this);">test</a>
<script>
function showName(element)
{
alert($(element).attr('name'));
}
</script>
showName(this)
вы передаете текущий элемент функции.
Изменить 2
Обновлена скрипка http://jsfiddle.net/eS7Mv/22/
просто посмотрите на скрипку: скрипка
вы должны передать параметр this, а затем использовать этот параметр внутри функции
function showName(pthis)
{
alert($(pthis).attr('name'));
}
<a id='link3' href='#' name='smith' onclick="showName(this);">test</a>
попробуй что-нибудь вроде этого
HTML
<a id='link3' href='#' name='smith' onclick="showName(this);">test</a>
Javascript
function showName(obj)
{
alert(obj.name);
//or
alert($(obj).attr('name'));
}
вторая и третья ссылки не должны работать, потому что в вашей функции javascript "this" указывает текущий объект, поэтому в то время javascript не может найти текущий объект, поэтому вам необходимо передать "это" в аргументе функции..
Это особенность jQuery, "это" в функции, связанной с этим:
Если вызываемая функция была создана с использованием функции Function.bind(), это будет первый аргумент, который был передан.bind() во время создания функции.
Ваши другие встроенные функции не работают, так как "это" - текущий контекст исполнения (я думаю, окно).
Если вам действительно нужно использовать именованные функции, вы могли бы сделать это:
$(function()
{
$('#link1').on('click', function(){
showName($(this));
});
}
)
function showName(clickedLink)
{
alert(clickedLink.attr('name'));
}
Маленькая скрипка, иллюстрирующая некоторые из этих:
Если все ваши теги начинаются со link
, вы можете сделать это
$('[id^=link]').on('click', function(){
alert($(this).attr('name'));
});
Вот обновленный working code
=> http://jsfiddle.net/eS7Mv/13/
Вы должны сохранить некоторое общее свойство между всеми элементами, которые затем будут доступны JQuery, и вы можете связывать события с теми, кто тогда
Согласно вашему комментарию, вы можете использовать именованные функции. Сообщите мне, могу ли я помочь вам с большим количеством кода.
$(function()
{
$('.click').on('click', showName );
}
)
function showName()
{
alert($(this).attr('name'));
// alert("Hello World");
}
Это обновленная скрипка => http://jsfiddle.net/eS7Mv/26/
Вы ищете e.target.node
, так что:
$('body').on('click', function(e){
alert(e.target.name);
});
Упростите свою жизнь.
Кроме того, если вы не хотите, чтобы он выполнялся для всего body
, вы также можете:
$('#link1, #link2, #link3').on('click', function(e){
Причина, по которой вы предыдущий код не работали, была из-за правил. В документах jQuery указано, что "Если вызываемая функция была создана с использованием функции Function.bind(), this
будет первый аргумент, который был передан.bind() во время создания функции". Думаю, в вашем случае это было неопределенным.
Используя консольную функцию в Chrome, я оказался прав. Посмотрите на этот снимок экрана и попытайтесь понять, что происходит. Вы видите, что делаете неправильно?
Когда события поднимаются, например событие щелчка, они несут важную информацию и ссылки вокруг них. В событии click объект события имеет ссылку на цель. Используя это, вы можете получить идентификатор элемента, который поднял событие.
Атрибут onclick
работает только тогда, когда JS-код находится перед этим тегом html или указанная функция не будет найдена.
В вашем примере это работает: http://jsfiddle.net/eS7Mv/20/
Но jQuery - лучший способ пойти на вас, например:
$('a').click(function(){
alert($(this).attr('name'));
});
.ready()
так что в любом случае это не отвечает на его вопрос
id
который является недействительным, они должны быть уникальными ..