Tips for optimizing jQuery for use on mobile devices

My webpage functions correctly on IE, Chrome, and Firefox, as well as on my friend's Galaxy phone. The code is very simple:

<script type="text/javascript" src="jquery-1.10.1.min.js"></script>
<script type="text/javascript">
function UpdateCart(itemid,todo)  
    {

$.ajaxSetup({ cache: false });
    $.get("http://www.example.com/updatecart.php?itemnumber=" + itemid + "&todo=" +     todo, function(){location.reload(true)});
    return false;
    }
</script>

Here is the link that triggers the action:

<a name='removefromcart' id='removefromcart' href='#' onClick='javascript:UpdateCart("60813","remove");return false;'>Remove Item</a>

However, when I view the page on my personal cell phone (not my friend's), everything appears fine. An onClick event to open a new window works properly, but clicking on jQuery functions does nothing. I have tried different approaches, including using text and buttons, but none of them work.

I was advised to use jQuery mobile, but I couldn't find clear instructions on how to implement it in my code. I'm not very experienced with this, so any guidance would be appreciated!

UPDATE: I also tested the page on my brother's iPhone 5, and encountered the same issue. It seems there may be an issue related to mobile devices.

Answer №1

Perhaps the issue lies in the lack of proper Ajax support for the specific cell you are using. I recommend checking out this resource:

Answer №2

After investigating, I discovered the root of the problem. It seems that the browser settings are configured this way to prioritize security!

So, I removed the absolute path from the ajax function. Instead of using http://www.example.com/filename.php/asdfasdf

I simply used filename.php/blahblah?id=.....

You catch my drift! It appears they have restrictions in place to prevent external requests when detecting http in the URL.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for bringing a particular tab into focus when a page initially loads

My webpage features custom links (tabs) that display content when clicked. By default, the first tab is selected and its content is shown, while the rest are set to display:none. Clicking on any other link will assign the 'selected' class to it, ...

Is there a way to locate and delete an image element with a broken hyperlink?

My website is currently hosted on Wordpress, and I've noticed that there is an issue with a broken image link on my site. I'm not sure when this occurred, but it seems to only be affecting the post section of my site. https://i.sstatic.net/iarDU ...

Populate a select list in real time with dynamically generated options

I'm facing a challenge at the moment; I am using JavaScript to dynamically generate select boxes, however, I require Ajax to populate them with options. At the moment, my code is returning undefined and I am unsure of how to proceed. While my PHP succ ...

Retrieve input field values using the jQuery Taggd plugin in edit mode

Incorporating the jQuery taggd plugin has been smooth sailing so far. I made a few tweaks, specifically to use it in edit mode. In this edit mode, when a user inputs a value in the textbox, the plugin checks whether it is a URL or a string. If it's a ...

Minimize the vertical gap between menu items when they wrap onto a new line

When examining the screenshot of the website, you'll notice a considerable space between the first and second rows of menu items. I'm aiming to minimize this spacing as much as possible. The following CSS pertains to this issue: .gva-navigatio ...

Looking for a solution to my issue - my for loop is looping more times than it should

I am designing a confirm dialog using jQuery and Bootstrap. When the user clicks on 'Yes' or 'No', it should trigger an action, such as drawing two squares each time. The first time I click either button, it draws 2 squares. However, wi ...

Resetting initial values with Velocity.js post-animation

After animating elements into view on a page, I want to defer further animation through CSS classes. However, Velocity keeps all animated properties in the style= tag, hindering CSS transitions. My solution involves resetting the CSS upon completion, but ...

I am facing difficulty in incorporating an IP address or URL within an IFRAME in my Cordova Android application

This page does not allow any iframes to load except for the YouTube video URL. When attempting to use any other iframe URL, the following error code is displayed: Error : net::ERR_BLOCKED_BY_RESPONSE In the example below, any URL or IP address fails to l ...

Creating a moving background for a loading bar with HTML5 and Shadow DOM is currently underway

Can anyone help with animating the progress bar using the HTML5 <progess> tag? I've been able to customize the Shadow DOM elements successfully, but I'm having trouble animating the background (repeating linear gradient). It seems to work i ...

Using an AngularJS directive to modify CSS styles

I'm attempting to modify DOM CSS styles using Angular. If the textbox value is set as the height, I have assigned ng-model to the textbox and then ng-style="{height:heightdef}" How can I achieve this using a directive? Fiddle :: http://jsfiddle.n ...

Issue arises when there are several inline <script> tags containing parameters which result in filtered JSON output

As a newcomer to JavaScript, I am faced with the challenge of creating a centralized glossary within a confined educational environment (LMS) that lacks a database or any other facilitating elements. My objective is to develop a script hosted on our applic ...

Having multiple divs lined up horizontally on a single row

I am trying to create three divs in a single row similar to this: https://i.sstatic.net/A63Sx.png Any assistance on how to achieve this setup would be greatly appreciated. ...

Automatically selecting the map center while using the Drawing Manager feature for placing markers

My application utilizes the Google Drawing Library. When a user clicks on the Add New Marker Button, the Drawing Manager is activated allowing the user to generate a marker by clicking anywhere on the map. Subsequently, the following listener is executed: ...

How can we display or conceal text indicating the age of a patient based on the value returned from selectedPatient.age in a React application?

Hello, I am looking to dynamically display the age in years on the screen based on the value retrieved from selectedPatient.age, toggling between visible and hidden states. import React, { useContext } from 'react'; import { useHistory } from &ap ...

Easy Registration Page using HTML, CSS, and JavaScript

In the process of creating a basic login form using HTML and CSS, I'm incorporating Javascript to handle empty field validations. To view my current progress, you can find my code on jsfiddle My goal is to implement validation for empty text fields ...

Arranging Divs in Bootstrap

Having issues with my Bootstrap layout where I have two divs: (A) set as col-lg-6 and (B) set as col-lg-6 on a large device. This currently displays as: (A)(B) I am trying to rearrange the order of these divs on a mobile or small device using col-sm-12 ...

Fresh class retains the characteristics of the former class

As I navigate my way through learning jQuery, I've encountered a puzzling issue that I can't seem to solve. No existing articles seem to address my specific problem, so I am turning to this platform in hopes of finding a solution. I'm puzz ...

The selection button's threshold

Welcome to my website design project! I have implemented image buttons for my web page and want to restrict the number of images a user can select. If a user tries to navigate away after selecting more than 3 images, I wish to display an alert message. Her ...

Opening external stylesheets in a separate window

Objective: Create a new window, add elements to it, and then apply CSS styles to the elements in the new window using an external style sheet. Issue: While I am able to add elements to the new window and link it to an external style sheet in the head sect ...

Customizing jQuery validation parameters (require identical functionality)

Utilizing jquery validation and bootstrap, I have encountered an issue when dealing with multiple forms in a view. The styling of validation messages does not remain consistent when I have to create a validator object manually for each form. How can I ens ...