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

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

如何連接一個變量中的值

如何連接一個變量中的值

繁花不似錦 2023-04-20 17:05:44
單擊一個變量時如何連接 div 的值?這是我的代碼示例。var concatenated_values; //1,2,3$("#first_container").click(function() {  console.log($("#first_container input:hidden").val());});$("#second_container").click(function() {  console.log($("#second_container input:hidden").val());});$("#third_container").click(function() {  console.log($("#third_container input:hidden").val());});#first_container, #second_container , #third_container{  width:300px;  height:200px;  background:red;  cursor:pointer;}<html><head>  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script></head><body><div class="container">  <div id="first_container">      <p>Test 1</p>      <input type="hidden" value='1'/>  </div>  <div id="second_container">      <p>Test 2</p>      <input type="hidden" value='2'/>  </div>  <div id="third_container">      <p>Test 3</p>      <input type="hidden" value='3'/>  </div></div></body></html>concatenated_values所以當(dāng)我點擊我所有的div時,我試圖在我這樣的地方獲得一個價值1,2,3我仍然可以單擊另一個 div,就像取消選擇一樣,所以當(dāng)我單擊選定的 div 時,它應(yīng)該更新我的變量并刪除它的值。1,3任何幫助將非常感激。
查看完整描述

4 回答

?
烙印99

TA貢獻1829條經(jīng)驗 獲得超13個贊

將您的變量作為數(shù)組并將 div 的值保存在該數(shù)組中。之后,您可以遍歷該數(shù)組并在需要時打印所有值,或者使用其他數(shù)組函數(shù)(如 reduce)來計算總和。


var concatenated_values = []; //1,2,3


$("#first_container").click(function() {

  const input = $("#first_container input:hidden").val();

  if (concatenated_values.includes(input))

    concatenated_values.splice(concatenated_values.indexOf(input), 1);

  else

    concatenated_values.push($("#first_container input:hidden").val());

  console.log(concatenated_values);

});


$("#second_container").click(function() {

  const input = $("#second_container input:hidden").val();

  if (concatenated_values.includes(input))

    concatenated_values.splice(concatenated_values.indexOf(input), 1);

  else

    concatenated_values.push($("#second_container input:hidden").val());

  console.log(concatenated_values);

});


$("#third_container").click(function() {

  const input = $("#third_container input:hidden").val();

  if (concatenated_values.includes(input))

    concatenated_values.splice(concatenated_values.indexOf(input), 1);

  else

    concatenated_values.push($("#third_container input:hidden").val());

  console.log(concatenated_values);

});

#first_container,

#second_container,

#third_container {

  width: 300px;

  height: 200px;

  background: red;

  cursor: pointer;

}

<html>


<head>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

</head>


<body>

  <div class="container">


    <div id="first_container">


      <p>Test 1</p>

      <input type="hidden" value='1' />


    </div>


    <div id="second_container">


      <p>Test 2</p>

      <input type="hidden" value='2' />


    </div>



    <div id="third_container">


      <p>Test 3</p>

      <input type="hidden" value='3' />


    </div>


  </div>


</body>


</html>


查看完整回答
反對 回復(fù) 2023-04-20
?
瀟湘沐

TA貢獻1816條經(jīng)驗 獲得超6個贊

您真的不需要為每個 div 添加單獨的點擊事件。


然后給一些邊框或改變背景顏色來了解點擊與否的區(qū)別。因此,如果單擊它,我會添加一些類。


所以最后的代碼是


<head>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

    <script>

        var concatenated_values = [];

        $().ready(function () {

            $("#first_container, #second_container, #third_container").click(function () {

                var val = $(this).find('input:hidden').val();

                var indx = concatenated_values.indexOf(val);

                if (indx > -1) {

                    concatenated_values.splice(indx, 1);

                    $(this).removeClass('selected');

                } else {

                    concatenated_values.push(val);

                    $(this).addClass('selected');

                }

                console.log(concatenated_values);

            });


        });

    </script>

    <style>

        #first_container,

        #second_container,

        #third_container {

            width: 300px;

            height: 200px;

            background: red;

            cursor: pointer;

            margin:10px;

            padding: 10px;

        }

        .selected {

            border: 2px solid rgb(48, 47, 46);

        }

    </style>

</head>


查看完整回答
反對 回復(fù) 2023-04-20
?
倚天杖

TA貢獻1828條經(jīng)驗 獲得超3個贊

我建議你改變你的邏輯,根本不使用全局變量。如果您修改 HTML 以便在每個 clickable 上放置一個公共類div,那么您可以使用一個類來跟蹤哪個是“活動的”,以便制作一個子值數(shù)組input。然后你可以join()這樣做來制作你需要的字符串。


這種方法更易于維護、可擴展且更簡單。這是一個例子:


$('.sub-container').on('click', e => {

  let $this = $(e.target).toggleClass('active');

  let concatenated_values = $('.active').map((i, el) => $(el).find('input').val()).get().join(',');

  console.log(concatenated_values);

});

.sub-container {

  width: 300px;

  height: 200px;

  background: red;

  cursor: pointer;

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

<div class="container">

  <div id="first_container" class="sub-container">

    <p>Test 1</p>

    <input type="hidden" value="1" />

  </div>

  <div id="second_container" class="sub-container">

    <p>Test 2</p>

    <input type="hidden" value="2" />

  </div>

  <div id="third_container" class="sub-container">

    <p>Test 3</p>

    <input type="hidden" value="3" />

  </div>

</div>


查看完整回答
反對 回復(fù) 2023-04-20
?
心有法竹

TA貢獻1866條經(jīng)驗 獲得超5個贊

使用類會簡化事情,下面我使用一個名為 selected 的類,然后您可以使用 toggleClass 方法打開或關(guān)閉。


然后您可以找到所有具有所選類的 Div,然后將值相加。


例如。


$('.container > div').click(function () {

  var $t = $(this);

  $t.toggleClass('selected');

  var concatenated = [];

  $t.closest('.container')

    .find('.selected').each(function () {

      concatenated.push($(this).find('input').val());

    });

  $('#result').text(concatenated.join(','));

});

.container > div {

  width:300px;

  height:30px;

  background:red;

  cursor:pointer;

}


.container > .selected {

  background: pink;

}


#result {

  width:300px;

  height:30px;

  background: yellow;  

}

<html>

<head>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

</head>

<body>

<div class="container">


  <div id="first_container">


      <p>Test 1</p>

      <input type="hidden" value='1'/>


  </div>


  <div id="second_container">


      <p>Test 2</p>

      <input type="hidden" value='2'/>


  </div>



  <div id="third_container">


      <p>Test 3</p>

      <input type="hidden" value='3'/>


  </div>


</div>


<p>Result</p>

<div id="result"></div>


</body>

</html>


查看完整回答
反對 回復(fù) 2023-04-20
  • 4 回答
  • 0 關(guān)注
  • 185 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號

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