Javascript kullanarak div'deki bir bağlantıya tıklandığında div'deki diğer tüm bağlantılar nasıl devre dışı bırakılır [duplicate]

Question 1

Javascript yeni duyuyorum. Div'deki bir bağlantıya tıklandığında div'deki diğer tüm bağlantıları devre dışı bırakmak istiyorum. Bu div içindeki herhangi bir bağlantıyı tıklarsam, bu div içindeki diğer bağlantılar devre dışı bırakılmalı ve kilitlenmemelidir.

Bu kod, herhangi bir düğmeye tıklandığında bağlantıları tıklanamaz hale getirmez . Herhangi bir bağlantıya tıklanırsa, bu div'deki diğer bağlantılar devre dışı bırakılmalı ve kapatılmamalıdır. Örneğin, bağlantıyı kabul et tıklanırsa, bağlantıları kabul et, reddet ve karşı teklif bağlantıları tıklanamaz ve devre dışı bırakılmalıdır.

Çıktı

function disableButton() {
  document.querySelector("#notify-div a").removeAttribute("href");

}

<div id="notify-div">
  user_name has requested a bid price of bid for quantity of qty for mileage mileage_name of truck truck_name.
  <br> <a href='/truckianAccept/".$lastId."' id='accept' class='btn btn-primary' onclick='disableButton();'>Accept </a>
  <a href='/truckianDecline/".$lastId."' id='decline' class='btn btn-primary' onclick='disableButton();'>Decline </a> <a href='/wstCounterOffer/".$lastId."' id='counter' class='btn btn-primary' onclick='disableButton();'>Counter Offer </a>";
</div>

Question 2

Kaldırmak yerine href css'de işaretçi olaylarını yakalayan bir sınıf belirlersiniz.

function disableButtons() {
  const links = document.querySelectorAll("#notify-div a");

  links.forEach(function(link) {
    link.classList.add('disabled');
  });
}

CSS:

.disabled {
  pointer-events: none;
}

Lütfen dikkat, bu href ve onClick birlikte çalışmayacağız. İşlevselliği işleyen ve daha sonra düğmeleri devre dışı bırakan her bağlantıya belirli bir işlev iletmeniz gerekir.

HDinger · Answer 1 · 2021-11-17T07:06:40

1

Kaldırmak yerine href css'de işaretçi olaylarını yakalayan bir sınıf belirlersiniz.

function disableButtons() {
  const links = document.querySelectorAll("#notify-div a");

  links.forEach(function(link) {
    link.classList.add('disabled');
  });
}

CSS:

.disabled {
  pointer-events: none;
}

Lütfen dikkat, bu href ve onClick birlikte çalışmayacağız. İşlevselliği işleyen ve daha sonra düğmeleri devre dışı bırakan her bağlantıya belirli bir işlev iletmeniz gerekir.

HDinger

2021-11-17 07:06:40

Çalışmıyor, bu kod çalıştırıldıktan sonra düğme devre dışı bırakılmaz

Binsha

Ne işe yaramıyor? Çözüm, tanım gereği "devre dışı" olan bağlantıya tıkladığınızda herhangi bir kodun yürütülmesini engeller. Bağlantının farklı görünmesini istiyorsanız, elbette stili değiştirmeniz gerekir. Bunun nasıl yapılacağı da zaten bağlantılı cevapta açıklanmıştır. Kullanamayacağınızı unutmayın href ve onclick birlikte.

HDinger

Peki href ile hangi işlev kullanılabilir?

Binsha

Hiçbiri. Bunlardan herhangi birini kullanırsınız href bir url yönlendirmesi için öznitelik VEYA onClick mantıksal adımları yürütmek için. Sizin durumunuzda, kullanmanız gerekir onClick. İlettiğiniz işlevde, önce düğmeye bağlı mantığı yürütürsünüz ve daha sonra diğer düğmeleri devre dışı bırakmak için işlevi çağırırsınız.

HDinger

<a href='/truckianAccept/".$lastİd."'id =' kabul et 'class=' btn btn-primary 'onclick=' disableButton ();'>Kabul et >< / a> . Aramanın doğru yolu bu mu?

Binsha

<a id = 'kabul et' class= 'btn btn-birincil' onclick= 'executeStuffAndDisableButton ();' >Kabul Et <a id= 'kabul et' class= 'btn btn-birincil' onclick= ' executeStuffAndDisableButton ();'>< / a>< / a>

HDinger

neden bu işlev 'executeStuffAndDisableButton ();'?

Binsha

Çünkü href ile birlikte koyamazsınız onclick. Bunun yerine, ilettiğiniz işlevin içindeki her şeyi yapmanız gerekir: düğmelerin yanı sıra gerçek mantığı devre dışı bırakmak

HDinger

Javascript kullanarak div'deki bir bağlantıya tıklandığında div'deki diğer tüm bağlantılar nasıl devre dışı bırakılır [duplicate]

Soru

En iyi cevabı

Diğer dillerde

Bu sayfa diğer dillerde

Bu kategoride popüler

Popüler soruları bu kategoride