мне действительно нужно добавить несколько прослушивателей событий с несколькими разными аргументами? - PullRequest
1 голос
/ 03 августа 2020
        <body>

 <div id = "styleDiv">
 <p> add to cart <span id = "balls"> 25.99 </span> </p> 
 <p> add to cart <span id=  "racket"> 68.99 </span> </p>
 <p> add to cart <span id=  "grip"> 6.99 </span> </p>
 <button> price after tax </button>

 </div>


  <script>
  
  var btn = document.querySelector("button");
  var balls = document.querySelectorAll('#balls');
  var racket = document.querySelector('#racket');
  var grip = document.querySelector('#grip');
  
  btn.addEventListener( 'click', function() { 
  calcPrice(balls);
  })
  
    btn.addEventListener( 'click', function() { 
  calcPrice(racket);
  })
  
     btn.addEventListener( 'click', function() { 
  calcPrice(grip);
  })
  
 
    
    //***************************************** READING A NUMBER INSIDE THE PRGRAM WITH INNERHTML AND 
    THEN CONTROLLING DECIMAL LENGTH ******************************
   function calcPrice(element) {

 var price = element.innerHTML; 
 var tax = 0.175;// tax rate
 var fullPrice = (price * tax) + parseFloat(price); 

 fullPrice = fullPrice.toString(); 

 if (fullPrice.charAt(5) == "5") {  

 fullPrice = fullPrice.slice(0,5)+ "4";

 }
 fullPrice = Number(fullPrice);   
 var totalPrice = fullPrice.toFixed(2);

 element.innerHTML = totalPrice;

 return totalPrice;

 }

Как сократить этот код? так что мне не нужно добавлять несколько прослушивателей событий, чем больше разных интервалов? Например, если я планирую добавить 30 разных диапазонов, у меня наверняка будет enet 30 разных слушателей событий. Например, добавить одного слушателя событий для всех разных диапазонов, который затем передаст аргумент удержания в функцию, а затем вернет ответ. Возможно ли такое

всем спасибо

1 Ответ

0 голосов
/ 03 августа 2020

Вам не нужно добавлять прослушиватель событий к каждой отдельной кнопке. В зависимости от того, что вы хотите сделать, вы можете заключить свои кнопки в тег <div> и вместо этого добавить прослушиватель к этому тегу, чтобы прослушивать все кнопки. Однако вам нужно убедиться, что кнопка действительно нажата, а не только <div>. Вы можете увидеть здесь пример .

...