亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何將子 div 位置編號分配給子 div 內的標簽

如何將子 div 位置編號分配給子 div 內的標簽

米脂 2021-11-04 15:17:40
我在父 div 中有多個子 div,每個 div 都有一個標簽,標記看起來像這樣。<div id="Parent">    <div id="Child1" onclick="DeleteDiv('#Child1')">        <label> 1<label>    </div>    <div id="Child2" onclick="DeleteDiv('#Child2')">        <label>2<label>    </div>    <div id="Child3" onclick="DeleteDiv('#Child3')">        <label>3<label>    </div>    <div id="Chile4" onclick="DeleteDiv('#Child4')">        <label>4<label>    </div></div>每個子 div 都有刪除選項和刪除 div 的腳本是function DeleteDiv(divtodelete) {        $(divtodelete).remove();    }現在假設我刪除 Child1 我希望標簽的其余部分更新為值 1,2,3 而不是保留為 2,3,4。另一種情況是,如果我刪除 child2 標簽,則應分別使用值 1,2,3 更新,而不是保留為 1,3,4。我該怎么做呢?
查看完整描述

1 回答

?
楊魅力

TA貢獻1811條經驗 獲得超6個贊

首先,你的 HTML 是無效的,因為你有開始label標簽而不是結束標簽。接下來,不要在 HTML 中進行內聯事件處理,而是將其分開并在 JavaScript 中進行。


對于您的問題,只需在刪除 div 后循環標簽,并使用標簽集合中的索引位置更新其文本:


// Set up event handlers on each of the child divs.

// Don't do event handling in HTML, do it in JavaScript

$("#Parent > div").on("click", function(event){

  this.remove();

  updateLabels();

});


function updateLabels(){

  // Loop over each label in the child divs

  $("#Parent > div > label").each(function(index){

    $(this).text(index + 1); // Update the text based on the index

  });

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="Parent">

    <div id="Child1">

        <label>1</label>

    </div>

    <div id="Child2">

        <label>2</label>

    </div>

    <div id="Child3">

        <label>3</label>

    </div>

    <div id="Child4">

        <label>4</label>

    </div>

</div>


查看完整回答
反對 回復 2021-11-04
  • 1 回答
  • 0 關注
  • 174 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號