473,416 Members | 1,836 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,416 software developers and data experts.

Handling .click() in the Safari browser

DizelArs
1 Bit
Hi all)

Faced with a problem, element.click() event doesn't work in Safari browser.
Tried various tricks like emulating touch event through a function:

Expand|Select|Wrap|Line Numbers
  1. let clickEvent = new Event('click', {
  2.   bubbles: true,
  3.   cancelable: true,
  4.   view: window
  5. });
Replace play.click(); with play.dispatchEvent(clickEvent);

Added a style to all clickable elements:

Expand|Select|Wrap|Line Numbers
  1. cursor: pointer;
I put a check to add the event depending on the platform:

Expand|Select|Wrap|Line Numbers
  1. const whatDevice2 = /iPad|iPhone|iPod/.test(navigator.userAgent);
  2. let whatEventUse2 = whatDevice2 ? 'touchstart' : 'click';
I need after clicking on the button, to click on the element in the layout.
This works on all platforms and browsers except Safari\IOS.

Here is all the code:

Expand|Select|Wrap|Line Numbers
  1. const whatDevice2 = /iPad|iPhone|iPod/.test(navigator.userAgent);
  2. let whatEventUse2 = whatDevice2 ? 'touchstart' : 'click';
  3.  
  4. let play = document.querySelector('#app-2 .cp-play-icon.cp-play-icon-paused');
  5. let originalId = audioPlay2[index].dataset.originalId;
  6. let elementToClick = document.querySelector(#${originalId});
  7. let audioButton = popupElement2.querySelector('a.popup__description_audio');
  8.  
  9. audioButton.addEventListener(whatEventUse2, () => {
  10.   if (elementToClick.classList.contains('cp-playlist-link_current')) {
  11.     play.click();
  12.     setTimeout(addIdLi2, 0);
  13.   } else {
  14.     elementToClick.click();
  15.     { setTimeout(addIdLi2, 0);
  16.    }
  17.  });
Apparently there is some subtlety that I don't see, and the ways I found on the internet didn't help.
If anyone has any knowledge in this matter, please give me advice on what to do or point me in the right direction).
I would be glad to have any information, thank you!
Jun 8 '23 #1
0 15333

Sign in to post your reply or Sign up for a free account.

Similar topics

5
by: Foreman | last post by:
Using ASPFileUpload (http://support.microsoft.com/default.aspx?scid=kb;en-us;299692) and works for IE6 and FireFox but not Safari. Thanks in advance for your assistance.
4
by: Lance Dyas | last post by:
I have managed to get the xml to load using the xmlHTTPrequest... (inspite of premature readyState 4) the problem now arises in Safari alone... var thelink = node.getAttribute("xlink:href") ...
4
by: Greg Scharlemann | last post by:
I'm getting reports (which is all I can go on cause I don't have a mac or safari browser - new question: can I install safari on a windows box?) that the javascript at:...
4
by: Paul W | last post by:
Hi - can someone point me to info on the issues/resolutions of supporting the safari browser? To help me understand, if I was developing pages in say FrontPage, what attributes would I set for...
5
by: Bill Cohagan | last post by:
I'm having some serious difficulties with my ASP.Net 2.0 app rendering in Safari 2.0.3. The most immediate problem is that the menu control doesn't seem to work at all, particularly the use of...
2
by: ipy2006 | last post by:
Only in Safari browser the current year shows as 1970. Also "Non digits found in year" is triggered in the Safari broswer. Please help. Thanks, Yasaswi function verifyYear( field ) { var _x =...
2
by: Sudantha | last post by:
Hi, I'm working with a web application which is developed using asp.net c#. In a particular page when click on a button it has to do a process and then proceed to another page. While in this process...
3
by: gsuns82 | last post by:
Hi all, The following code is not working properly in Mac os/safari browser. function newWindow(){ window.open('<jstl_core:url...
1
by: lyle | last post by:
I like Google Newsgroups. But I have not found a convenient way to check speling. So I fall back on XNews and use an external editor. Recently I have tried Apple's free Safari Browser for Windows,...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.