第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

如何將css規(guī)則添加到j(luò)query中動(dòng)態(tài)創(chuàng)建的元素

如何將css規(guī)則添加到j(luò)query中動(dòng)態(tài)創(chuàng)建的元素

PHP
慕工程0101907 2022-06-17 10:51:47
是否可以將 css 添加到 jquery 中特定的動(dòng)態(tài)創(chuàng)建的 div 中?我想將覆蓋添加到特定的 div,但試圖找到一種方法將 id 從動(dòng)態(tài)創(chuàng)建的 div 傳遞到 jquery 函數(shù),以便僅將 CSS 規(guī)則添加到該特定 div,這對(duì)我來(lái)說(shuō)是一項(xiàng)任務(wù)。當(dāng)我單擊 div 時(shí),它會(huì)將疊加層添加到所有這些中。感謝您的時(shí)間,這是我的代碼。foreach($selectedPhotoResult as $rowSelect){    if($counter % 3 === 1){        echo '</div><div class="row">';    }        echo'        <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4 text-center picContainer">            <a class="overlayPicHL" data-overlayPicID-id="'.$row['ad_id'].'"><div class="price" style="position:absolute;top:0px;;right:15px;z-index:98;height:50px;width:50px;border-radius: 0px 5px 0px 0px;background-image: linear-gradient(to bottom, rgba(0,0,0,0.8) 50%, rgba(0,0,0,0) 100%);"><i class="fa fa-eye" style="font-size:25px;color:#ffffff;position:absolute;top:10px;right:10px;"></i></div></a>                <div class="well photoControlsMain pht-brd-cl">                    <a class="mainImageProfile" style="display:block;" data-userMain-id="'.$row['ad_user'].'" data-pic-id="'.$row['ad_photo_thumb'].'">                        <div class="imageOverlayStyle">                            Something here                        </div>                        <figure>                                                                                   <img src="'.$row['ad_photo_thumb'].'" class="img-responsive imageSizingGallery imageProfileStyleSmall" style="object-fit: contain;" width="100%" alt=""/>                        <div class="photoControlsMainImage">                            <p style="z-index:9999;">                        <span class="text-prt-und-bl usernameIndexPos">'.ucwords($row['industryName']).'</span>                        <span class="adRateIndexPos">$'.$row['ad_rate'].'/hr</span>         ';這是一個(gè)簡(jiǎn)單的覆蓋過(guò)渡,我只需要弄清楚如何將此覆蓋添加到從數(shù)據(jù)庫(kù)中提取的特定 div 中......動(dòng)態(tài)創(chuàng)建。我已經(jīng)尋找了一段時(shí)間的解決方案,但還沒(méi)有這樣的運(yùn)氣。
查看完整描述

3 回答

?
嚕嚕噠

TA貢獻(xiàn)1784條經(jīng)驗(yàn) 獲得超7個(gè)贊

.imageOverlayStyle您要定位的是 clicked 的下一個(gè)兄弟的孩子,.overlayPicHL所以使用nextElementSiblingand [0]:


$(".overlayPicHL").on("click", function() {

  const imageOverlayStyle = $(this.nextElementSibling).find('.imageOverlayStyle');

  $(imageOverlayStyle).css({

    backgroundColor: 'yellow'

  });

});

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

<div class="col-xs-12 col-sm-4 col-md-4 col-lg-4 text-center picContainer">

  <a class="overlayPicHL" data-overlayPicID-id="'.$row['ad_id'].'">overlayPicHL

    <div class="price"><i class="fa fa-eye" style="font-size:25px;color:#ffffff;position:absolute;top:10px;right:10px;"></i></div>

  </a>

  <div class="well photoControlsMain pht-brd-cl">

    <a class="mainImageProfile" style="display:block;" data-userMain-id="'.$row['ad_user'].'" data-pic-id="'.$row['ad_photo_thumb'].'">

      <div class="imageOverlayStyle">

        Something here

      </div>

      <figure>

        <img src="'.$row['ad_photo_thumb'].'" class="img-responsive imageSizingGallery imageProfileStyleSmall" style="object-fit: contain;" width="100%" alt="" />


        <div class="photoControlsMainImage">

          <p style="z-index:9999;">

            <span class="text-prt-und-bl usernameIndexPos">usernameIndexPos</span>

            <span class="adRateIndexPos">adrate</span>

          </p>

        </div>

      </figure>

    </a>

  </div>

</div>

<div class="col-xs-12 col-sm-4 col-md-4 col-lg-4 text-center picContainer">

  <a class="overlayPicHL" data-overlayPicID-id="'.$row['ad_id'].'">overlayPicHL

    <div class="price"><i class="fa fa-eye" style="font-size:25px;color:#ffffff;position:absolute;top:10px;right:10px;"></i></div>

  </a>

  <div class="well photoControlsMain pht-brd-cl">

    <a class="mainImageProfile" style="display:block;" data-userMain-id="'.$row['ad_user'].'" data-pic-id="'.$row['ad_photo_thumb'].'">

      <div class="imageOverlayStyle">

        Something here

      </div>

      <figure>

        <img src="'.$row['ad_photo_thumb'].'" class="img-responsive imageSizingGallery imageProfileStyleSmall" style="object-fit: contain;" width="100%" alt="" />


        <div class="photoControlsMainImage">

          <p style="z-index:9999;">

            <span class="text-prt-und-bl usernameIndexPos">usernameIndexPos</span>

            <span class="adRateIndexPos">adrate</span>

          </p>

        </div>

      </figure>

    </a>

  </div>

</div>


查看完整回答
反對(duì) 回復(fù) 2022-06-17
?
德瑪西亞99

TA貢獻(xiàn)1770條經(jīng)驗(yàn) 獲得超3個(gè)贊

您可以class在整個(gè)文檔中找到并添加,如果您希望它僅添加到) div中css,您可以使用next()next(


$(document).on("click", ".overlayPicHL", function(){

    var id = $(this).attr("data-overlayPicID-id");

    $(this).next(".imageOverlayStyle").css({"height":"100%"}); //<-this is the css I want to add to the specific div when the icon has been clicked

});

.imageOverlayStyle {

  position: absolute;

  bottom: 0;

  left: 0;

  right: 0;

  background-color: #008CBA;

  overflow: hidden;

  width: 100%;

  height: 0;

  transition: .5s ease;

}

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



<a class="overlayPicHL" data-overlayPicID-id="'.$row['ad_id'].'">


<div class="price" style="position:absolute;top:0px;;right:15px;z-index:98;height:50px;width:50px;border-radius: 0px 5px 0px 0px;background-image: linear-gradient(to bottom, rgba(0,0,0,0.8) 50%, rgba(0,0,0,0) 100%);"><i class="fa fa-eye" style="font-size:25px;color:#ffffff;position:absolute;top:10px;right:10px;"></i></div></a>

<div class="imageOverlayStyle" id="imgOvrlayID" data-imgOvly-id="'.$row['ad_id'].'">

    Something here

</div>


查看完整回答
反對(duì) 回復(fù) 2022-06-17
?
牧羊人nacy

TA貢獻(xiàn)1862條經(jīng)驗(yàn) 獲得超7個(gè)贊

將規(guī)則添加到樣式表,以便它們自動(dòng)應(yīng)用于新創(chuàng)建的元素。創(chuàng)建元素時(shí)鏈接 css() 方法: $('') 。appendTo(document. ... 動(dòng)態(tài)創(chuàng)建一個(gè)新樣式表:$("").


$('<img id="newImage" src="text.jpg"/>')

.appendTo(document.body)

.css(style);

動(dòng)態(tài)創(chuàng)建一個(gè)新的樣式表:


$("<style>").text("#myNewEl { width:40px; height:35px; }").appendTo("head");


查看完整回答
反對(duì) 回復(fù) 2022-06-17
  • 3 回答
  • 0 關(guān)注
  • 144 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)