Execute javascript based on # in target URL

Question

when someone clicks an element that points to #checkoutID I'd like to execute a script.

this is the element:

<a class="lp-element lp-pom-button" id="lp-pom-button-293" href="**#checkoutID**" target="_self" data-params="true"><span class="label">Checkout</span></a>

this is the script:

stripe.redirectToCheckout({
  lineItems: [{
    price: '{{checkoutID}}', 
    quantity: 1,
  }],
  mode: 'payment',
  successUrl: 'https://example.com/success',
  cancelUrl: 'https://example.com/cancel',
}).then(function (result) {
});

I'm struggling with retrieving the string after # to see if it contains "checkout" and then execute the script by using the checkoutID as a value for price, which in this example, the price value is just an ID of the item. Would anyone be kind enough to provide some pointers here. Thank you

Answer 1

If you want to check the current url you can use

window.location.href;

And, if you want to call a function on some event, use:

document.querySelector(‘#bttonOrElementID’).addEventListener(‘click’, function(){
//your function goes here
});