Функция javascript получает вызов дважды

Question

Я пытаюсь вызвать функцию javascript при нажатии ссылки. На самом деле я хочу, чтобы отправить форму по нажатию на ссылку, используя метод столба, так что я пытаюсь сделать то

ценам ниже

<a href="javascript:submitCategory(this)" >Handicrafts</a> 

и в JavaScript

function submitCategory(varthis) 
{ 
    alert(varthis.value); 
} 

У меня есть несколько важных вопросов: 1> Когда Я нажимаю на ссылку, которую функция submitCategory вызывается дважды. После большого анализа выяснилось, что у меня было два js-файла, которые были включены, и удаление одного из них заставляло функцию получать вызов только один раз. означает , когда я включил

<script type ="text/javascript" src="jquery.js"></script> 
    <script type ="text/javascript" src="cWed.js"></script> 

функция submitCategory вызывается дважды

и когда я удалить один из них, и включают в себя

<script type ="text/javascript" src="jquery.js"></script> 

функцию submitCategory вызывается только один раз.

Почему так?

2> alert (thisvar.value) должен возвращать Ремесла, но он возвращает undefined. почему это может быть?

3> что именно означает href = "javascript: submitCategory (this)"? я не сталкивался с этим ни в одном учебнике. и в том числе это здесь должно относиться к элементу «a» право?

Answer 1

1. Вам не нужно использовать спецификатор «JavaScript:»
2. когда вы подключаетесь событие в HTML, всегда стараюсь делать это как event_handler(event). Примечание: событие - это объект события. а не какая-то случайная величина здесь. Вы можете узнать больше об этом во многих местах в Интернете. В вашем случае varthis - объект события. для доступа к этому элементу используйте varthis.target, а затем, чтобы получить его внутренний html, вы можете использовать varthis.target.innerHTML
3. Когда функция вызывается, вам нужно либо явно получить содержимое html вызывающего элемента через тег события, либо просто использовать jquery. Вы не можете передавать переменные так, как думаете, что сейчас проходите.
4. Если вы на самом деле пытаетесь отправить форму, я бы рекомендовал подключить событие onSubmit в скрипте, а не в HTML, и поместить туда свой код формы. Если вам не нужно ничего делать в представлении формы, вы можете просто поместить URL-адрес функции целевого сервера в атрибут action формы.

Пример кода:

<form> 
    <a href="#" id="submitCategoryLink">Submit Category</a> 
</form> 
<script type="text/javascript"> 
    $('#submitCategoryLink').on('click', function (e) { 
     alert(e.target.innerHTML) 
    }); 
</script> 

Answer 2

1. Поскольку вы не выложили содержимое cWed.js это трудно понять, почему вы получаете двойное представление, но я думаю, что она содержит click обработчик который дублирует обработчик по умолчанию.

2. Причина varthis.value не работает, потому что это .value используется только для <input> и <select> элементов, она содержит значение, введенный пользователя или выбранный из меню. Чтобы получить текстовое содержимое элемента, вы должны использовать .innerHTML.

3. URI, который начинается с javascript:, означает, что вместо того, чтобы извлекать страницу из сетевого местоположения, браузер должен выполнить код Javascript после этого префикса. Это не официально признанная схема URI (есть интернет-проект RFC, но он истек 2 года назад), но все браузеры поддерживают его.

4. Когда код выполняется из UTC javascript:, this - это окно, а не элемент, на который был нажат. Вам нужно использовать обработчик onclick, чтобы установить this в элемент.

следующие работы:

<a href="javascript:void(0)" onclick="submitCategory(this); return false;" >Handicrafts</a> 

function submitCategory(varthis) 
{ 
    alert(varthis.innerHTML); 
} 

FIDDLE