Button onclick javascript void 0

How to Call JavaScript Function on Click Events

JavaScript is one of the core programming language used on the websites. JavaScript enables interactive web pages and is an essential part of web applications. Most of the modern websites relies on JavaScript to handle client side application behavior. All the web browsers have a dedicated JavaScript engine to execute it.

In this tutorial you will learn, how to call a JavaScript function on various page events like: On click , on form submission, or other various HTML controls.

Create a JavaScript Function

First of all, create a JavaScript function to use further in this tutorial. Add this JavaScript code between … tag of the web page. You may also create function under separate JavaScript file and include in HTML page.

The above function will print current datetime in a popup. Let’s call this function on click events of various HTML controls. These HTML controls needs to put under tag of web page.

1. Call JavaScript on Hyperlink Click

Add below HREF html code in body section and access on web browser. Now just click link, It will execute JavaScript’s myFunction which will show current date as per used above.

2. Call JavaScript on Form Submit

To call the function when a user submits a form, add the `onsubmit` attribute to the form and set its value to the function name. For example:

3. Call JavaScript on Button Click

To call the function when a user clicks on a button, add the onclick attribute to the button and set its value to the function name. For example:

4. Call JavaScript on Link with P Tag

To call the function when a user clicks on a link with a p tag, you can use the same approach as for a hyperlink. For example:

Note: You can also attach event listeners to these elements using JavaScript code instead of inline attributes. This is considered a best practice and allows for better separation of concerns between HTML and JavaScript code.

Conclusion

In conclusion, JavaScript provides a powerful and flexible way to create interactive web pages that respond to user actions. By using the techniques outlined in this article, you can easily call JavaScript functions when users click on hyperlinks, buttons, forms, or links within p tags. Whether you’re building a simple website or a complex web application, understanding how to handle click events with JavaScript is an essential skill for any web developer.

Источник

What is javascript:void(0)?

While surfing the web, you might come across many links and buttons. In most cases, clicking on these links will take you to a certain page within the website. It might also redirect you to another page of a different website. This is done for you to gather more information about a topic.

But when you are writing some JavaScript for a website, you might not want that to happen. You might want the user to click on a certain link but stay on that page without reloading it or directing them to another page. This can be is possible by using javascript: void(0).

What do you mean by javascript: void(0)?

The javascript:void(0) is often used while creating HTML documents. This is used when an expression in the web page can lead to an undesired effect. This can be loading a new web page. In such situations, adding javascript:void(0) to the HTML document will remove this effect.

The void operator returns a null value so that the browser does not load a new web page. This utility comes in handy when you want to perform useful actions on the web page. This can be updating certain values on the page by clicking on a link.

Here is a simple example of using javascript:void(0):

This will display something like:

We will see the different uses of the javascript: void(0) method in the upcoming sections of the article.

How to Use onclick with javascript: void(0)?

The onclick attribute is usually associated with an HTML button. This means that an event or an action will occur when you click on that button. In JavaScript, onclick is an event that occurs when you click on an HTML element, such as a button.

This attribute is used along with javascript: void(0) to prevent a page from reloading. Let us look at an example:

Output:

When this code is executed, an alert box will be displayed with the message “Page will not reload”. But the javascript: void(0) will prevent the page from refreshing or reloading.

What to do when href=»javascript: void(0)» is Not Working?

If the href=” javascript: void(0)” does not work, you can use the href=”#” inside an anchor tag. Your JavaScript function must return False. This will remove the default action of the element on the web page.

Use of “javascript: void(0)” on a Web Page?

As mentioned earlier, the javascript: void(0) is a function used for instructing the web page to not follow its usual path of action. This effective when an event such as a button click is encountered or when you click on a link.

Difference Between void() and void(0)

The void is a unary operator in JavaScript. It usually appears before a single operand. This void() operator is used for mentioning an expression that will be evaluated. But this expression will not return a value. This operator will execute an expression ad will return undefined.

Now let us understand void(0). You might pass a unary expression 0 along with the void() to make it void(0). JavaScript reads the 0 as False and the value has no effect on the code. Thus, this is used in JavaScript for halting an action such as loading a page or refreshing a page.

void(0) means «do nothing»

You may occasionally encounter an HTML document that uses href=»JavaScript:Void(0);» within an < a >element.

Example 1: Javascript:void (0) in Anchor Tag:

Источник

блог

Верстальщику нужно было создать кусок текста, при клике на который вызывается обработчик onclick и больше ничего не происходит. Вместо кнопки (input или button) или простого span-а он почему-то решил непременно использовать ссылку (a). Если оставить атрибут href пустым («»), то при клике на ссылку страница перезагрузится. Если записать в него решетку («#»), то по клику страница перемотается на самый верх. URL вида javascript:void(0) указывает браузеру, что нужно выполнить код JS — функцию void(), которая ничего не загружает, не прокручивает и вообще ничего не делает.

Зачем используется такой хитрозакрученный вариант — непонятно. Видимо, верстальщик когда-то подсмотрел этот прием в древних нетскейповских доках по JS и теперь бездумно сует его куда попало. Лучше сделать по-другому:

— использовать кнопку или просто span с onclick:

— если все-таки хочется использовать ссылку, то можно засунуть вызов функции в href:

— вежливый и дружелюбный верстальщик предусмотрел бы возможность «вручную» открыть эту ссылку на новой вкладке (по shift-клику, по средней кнопке мыши):

Не работает javascript:void(0) для ссылки

SergeyNetIt сказал(-а): 21.11.2013 18:44

Не работает javascript:void(0) для ссылки

Для ссылки в которой будут находятся вложенные пункты меню, я прописал javascript :void(0). Срабатывает только в Mozille. В опере пишет ошибка URL-адрес: :void(0)» target=»_blank» rel=»nofollow» >http://javascript :void(0) содержит номер порта вне диапазона от 1 до 65535. Не работает также ив сафари и ie6-9. В хроме открывается белый экран about :blank.

В защиту javascript:void(0); 16.05.2014 19:18

Намедни я решил посмотреть новости через Google. Нажимаю правой кнопкой на ссылку «другие новости» и в контекстном меню нет пунтка открыть в новом окне. При нажатии через ctrl новая вкладка не открывается. Я решил глянуть исходный код и вижу javascript: void (0); Для меня это стало новостью, ведь все что читал до этого — было однозначно против такого решения. Я имею ввиду ситуацию когда ссылка запускает какой-то js код и по прямому назначению не используется, то какую разметку лучше использовать? … или…

Void лучше href=»#» поскольку пользователя нет возможности открыть новое окно с тем-же самым документом. Т. е. поведение href=»#» при открытии в новом окне для пользователей неожиданно. Если какой-то возможности нет — то ее не должно быть в интерфейсе. Если на пальцах пользователь: кликает на 15 ссылок правой кнопкой мыши и открывает каждую в новой вкладке. В итоге у него 16 вкладок с одним и тем-же документом.

Более того, void «правильней» href=«javascript: void (0);» — ничего не делать. href=»#» — перейти в начало страницы.

Чтобы если вдруг стандарт «javascript:» отменят не было коллизий используйте вместе с ним onclick=«return false;». Подсмотрено у Гугл ньюс:

Кода, конечно, много, но так удобнее для пользователей.

P. S. под href=»#» я подразумевал когда хреф содержит только решетку. Если у вас есть ссылка href=»#someMark» и документ нормально реагирует на метку, то void не нужен.

Не работают JavaScript

Перелопатил весь форум по схожим темам и не нашел решения проблемы.

Три дня назад я обнаружил такую проблему у себя на ноутбуке (win7 sp1 x64):

При использовании firefox (пробовал и 7, и 8 версию) перестали отображаться или работать почти все элементы, основанные на javasript (неделю назад все прекрасно работало).

Проверил на множестве сайтов/форумов — везде одно и то же. Если какая-либо кнопка подразумевает исполнение скрипта типа «javascript://», то ноль реакции.

В число нерабочих попали также кнопки воспроизведения аудиозаписей известного сайта ВКонтакте.

Следуя подсказкам с вашего форума:

1. при вводе в адресную строку javascript:alert(«Работает!»); — ноль реакции

2. javascript в настройках браузера включен, в about:config — enabled

3. Временные файлы удалялись ccleaner’ом — не помогает

4. создавал новый профиль — не помогает

5. никаких дополнений в данный момент не установлено. был только AdblockPlus, который я и отключал и в конце концов удалил — все равно не работает ничего.

6. переустановка браузера не помогает

На работе на компе с другой конфигурацией (winxp sp3 x86) стоит также последний firefox. Проблема та же самая.

В других браузерах все работает нормально.

Антивирусы на компах разные — drweb и symantec. после полной проверки с последними базами — вирусов не обнаружено.

В общем, я не знаю, как и почему мои браузеры переклинило. Может кто-то сталкивался?

Источник