Targeting single page with JS

Here, the code operates on anything that matches the #searchButton element:

jQuery("#searchButton")

If there is a searchButton on other pages, it will match it, soo you need to be more specific.

For example, on the homepage, the <body> tag will have the home class, here is my sites homepage body tag:

<body class="home blog logged-in admin-bar no-customize-support">

So to make it target only the search button on the home page, you could try something like this:

jQuery(".home #searchButton")

Alternatively, only enqueue the JS on that particular page, but the selector method is superior. Make sure there is only one element on the page with that ID as IDs need to be unique

Related Posts:

  1. Retrieve POST data from AJAX call
  2. WordPress Ajax always returns a 404 error
  3. problem with ajax and the path to the php page
  4. How to use wp_localize_script in a WordPress page other than functions.php?
  5. Real time Duplicate title check
  6. Load custom field value into div with AJAX
  7. Jquery ajax to custom php file: returning blank data
  8. Update WordPress Custom Field with AJAX on cached page
  9. Looking for a better way to handle an ajax script that pulls in post data on click
  10. Can’t use get_results() in ajax query
  11. Problem with WordPress Ajax form
  12. Display notification only once
  13. Access/update database with jQuery
  14. How to display something in a div when the user clicks on a text in another div – no page refresh [closed]
  15. Passing jQuery value using Ajax to a page template
  16. ajax_object is not defined when ajax calls the function
  17. Returning a value from a PHP page
  18. Why is this Ajax not working?
  19. Stumped – Ajax Response Returns 0
  20. Colorbox ajax loading of outside HTML content works perfect on localhost but not on server
  21. Use ajax from function.php
  22. Ajax return code 400
  23. doing an ajax request always outputs 0
  24. Woocommerce add to cart quantity buttons with AJAX
  25. class click counter save number
  26. AJAX request status 200 but no actual “response”
  27. wordpress count link clicks by ip address
  28. ajax, right way to do it and make it works?
  29. Ajax load more posts with multiple tax query
  30. WordPress Sending data to Ajax with select option
  31. WordPress ajax doesn’t display object method on jQuery .change() function
  32. Ajax loaded form replaces form action with Ajax url
  33. prevent default not stopping page refresh. Passing form information to and from php with ajax in a wordpress site
  34. Ajax date_query not working past the first iteration
  35. Ajax request not sending to server and returning – wp-admin/admin-ajax.php 400
  36. Save Search System
  37. populate form fields in a loop with ajax
  38. dynamic dependent select dropdown
  39. Setting value of session with Ajax not working
  40. [jQuery]Adding shortcode
  41. Display parent and child taxonomies in separate drop down select fields
  42. Plugins not working on AJAX requests
  43. Can I use a jQuery Ajax request in Code Snippets Plugin for WordPress?
  44. WordPress admin-ajax.php 400 bad request
  45. Ajax contact form return 0
  46. AJAX – Returning Two JSON Objects with One PHP Function
  47. Pull GetOption() variable into jQuery dynamically created html
  48. Add Ajax Hooks and Call from Custom Template PHP
  49. WordPress Ajax Always returning 0
  50. How to keep track of when a vote is cast?
  51. WordPress plugin admin page – using WordPress function in linked php file
  52. A $_POST should occur when submit form but is not?
  53. My jQuery Ajax form submit is still refreshing page?
  54. Ajax search shows all results when user empties input?
  55. Why i can’t get custom fields value or post ID via Ajax?
  56. Output votes to div dynamically in wordpress
  57. Get uploaded image and attach it to the new post
  58. Admin-ajax php not working on new wordpress version
  59. Proper way to use WordPress function with AJAX PHP file
  60. Live search from database table
  61. Add a counter for mouseovers (custom field)
  62. Accessing an API with jQuery and AJAX
  63. How to set variables with AJAX request to use in another function in WordPress
  64. Search Ajax Call – Use Form Data in Response
  65. Why does PHP called with Jquery AJAX not allow additional php code to be added?
  66. WordPress cascading dropdown selection search based on Parent Page & Child Page
  67. Database entry removed on browser refresh, Ajax PHP jQuery
  68. jquery & ajax getting data from php in wordpress . admin-ajax.php returns 400
  69. How do I call a value from the datase using ajax
  70. Ajax result show in console if is called outside function and not showing in array
  71. Where to add my PHP codes for AJAX Jquery to work?
  72. How to change PHP variables with AJAX request in WordPress
  73. How to use wp_ajax_set_post_thumbnail?
  74. Can’t make lazy load for my site, help!
  75. How to reload a php script, using AJAX and jQuery
  76. wp_ajax_ 400 Bad Request
  77. update_post_meta Not Processing Array Data (Not Sure What I Am Missing)
  78. Input field duplicates on form submit by jQuery
  79. How to call a function from functions.php with ajax?
  80. Custom theme admin-ajax.php 400 (Bad Request)
  81. number of posts with “Load More”
  82. Find the method which AJAX GET calls
  83. Ajax not updating to database
  84. WordPress 404 when using AJAX to call php function
  85. how use php query in AJAX jquery
  86. Ajax Load more CPT via shortcode
  87. Submitting my form to the database and then redirecting to payment site
  88. Pass the updated value of aid from form using ajax
  89. ajax form with multiple submit buttons and values
  90. Add php function into .js file (for tinyMCE button)
  91. best way to communicate between php and jquery/javascript
  92. Fatal error: Uncaught Error: Call to undefined function wp_nav_menu()
  93. ajax form function error
  94. AJAX: WordPress filters inside $html do not work as intended
  95. Why not showing all post by default in my jquery filter
  96. Load Meta box value into div AJAX [duplicate]
  97. ajax problems on loading page [closed]
  98. Help with AJAX request
  99. I got this error POST https://localhost/meraboilerwp/[object%20Object] 404 (Not Found)
  100. custom AJAX filtering logic and outputting results into an Elementor Loop Grid widget

Leave a Comment