Href Javascript works on desktop but not on Mobile
Question
I am using to do this function to rotate html contents. It is working on laptop/mac but not working when I 'touch' the links on mobile phone.
<a href="javascript:void(0)" >Link 1</a>
<a href="javascript:void(0)" >Link 2</a>
<a href="javascript:void(0)" >Link 3</a>
<a href="javascript:void(0)" >Link 4</a>
<a href="javascript:void(0)" >Link 5</a>
Upon clicking, the html contents will be dynamically changed.
I tried
<a href="#" onclick="javascript:;" >Link 1</a>
Also tried
<a href="javascript:;">Link 1</a>
Both didnt work on mobile. Any idea why is this so? Do I need to add any codes in the javascript?
Edit:
The triggering code is this. Firstly it is using a class. Below is one of the methods.
bindMoveHandler:function(target){
var _this = this;
target.on(_this.options.trigger,'a',function(event){
var w = $(this).width();
var current_offset = $(this).offset();
var control_offset = target.offset();
var left = current_offset.left - control_offset.left;
var scale = w/100;
var d = 0; //index after move finished
Full code: http://www.jqueryscript.net/demo/jQuery-Plugin-For-Stylish-Tabbed-Slider-Kiwi-Slider/javascripts/kiwi-slider.js How do I modify this to suit the suggested solutions?
2 answers
solution1
1 2015-07-10 02:28:15
Use jQuery instead of the onclick attribute and use a function call something like this:
html:
<a href="#" id="onceClicked">Home</a>
jQuery (Tested):
$('#onceClicked').click(function(e) {
$(this).text('You clicked me!');
});
An example page would be like this:
<!DOCTYPE html>
<html>
<head>
<title>Change Text</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<a href="#" class="onceClicked">Link 1</a>
<a href="#" class="onceClicked">Link 2</a>
<a href="#" class="onceClicked">Link 3</a>
<a href="#" class="onceClicked">Link 4</a>
<a href="#" class="onceClicked">Link 5</a>
<script>
$('.onceClicked').click(function(e) {
$(this).text('You clicked me!');
});
</script>
</body>
</html>
Here is a working example:
Although if you wish to add html and not just text you would change this:
$(this).text('You clicked me!');
to something like this:
$(this).html('<b>You clicked me!</b>');
solution2
0 2015-07-10 02:34:42
Have you tried this:
<a href="#" onclick="yourFunction(); return false">Link 1</a>
Do keep in my mind that this method may bite a possible return value of yourFunction() .
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.