简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
首頁 > web前端 > js教程 > 主體

click事件觸發span元素內容改變的方法

小云云
發布： 2017-12-29 09:41:23
原創
4866 人瀏覽過

本文主要和大家分享checkbox:click事件觸發span元素內容改變的方法。小編覺得蠻不錯的，現在就分享給大家，也給大家做個參考。一起跟著小編過來看看吧，希望能幫助大家。

範例如下：

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>checkbox</title>
 <script src="jquery.js"></script>
</head>
<body>
<p>我想去<span id="spanId">_____</span></p>
<form action="#" id="form">
 <input type="checkbox" name="city" value="南京">南京
 <input type="checkbox" name="city" value="北京">北京
 <input type="checkbox" name="city" value="纽约">纽约
</form>
<script>
  $(function () {
   $("input[name=city]").click(function () {
    var arr = [];
    $("input[name=city]").each(function () {
     if(this.checked){
      arr.push(this.value);
     }else{
      var index = arr.indexOf(this.value);
      if(index != -1){
       arr[index] = "";
      }
     }
    });
    $("#spanId").text(arr.join(","));
   })
  });
</script>
</body>
</html>
登入後複製

相關推薦：

#Jquery對新插入的節點綁定Click事件失效的解決方法

jquery事件mousedown和Click事件不能同時用？

JQuery不能使用click事件的問題來解決

以上是click事件觸發span元素內容改變的方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！

相關標籤：
click span 元素
來源：php.cn
上一篇：jquery appaend元素中id綁定事件失效解決辦法 下一篇：實例詳解基於DOM之empty和remove的區別
本網站聲明
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
作者最新文章
最新問題
在行動視圖中，當使用者點擊連結時，如何關閉此導覽列？ 當使用者點擊連結瀏覽網站時，導覽列沒有關閉？我曾嘗試向每個連結新增點擊事件偵聽器以關閉導覽欄，但它不起作用！此外，處於活動位置（即X）的hamberberger選單圖示也沒有很好地...
來自於 2024-04-06 19:23:03
0
1
411
如果值存在，則取得記錄總和，將其視為 1，而不是精確值 我需要“打開”為2並單擊為1但現在我越來越喜歡打開為5並單擊為2"SELECTCOALESCE(sum(requested),0)asrequested,COALESCE...
來自於 2024-04-04 16:49:24
0
1
338
判斷數組中是否存在元素的過程是無效的 很抱歉打擾您，但我已經花了兩個小時來解決這個問題。問題是我的程式碼只加入了一個元素，但沒有加入其他id，寫的是「已經有」$(function(){$(".js-compa...
來自於 2024-04-03 13:03:54
0
1
377
地面濾鏡模糊過渡問題 按下按鈕會模糊背景，但在過渡時，div的邊緣過渡效果不佳。除了Firefox之外的所有瀏覽器都存在此問題，我該如何修復它？ varbtn=document.querySelecto...
來自於 2024-04-01 23:10:22
0
1
335
jQuery 變數重定向到未定義的 url，儘管它是一個字串 我在嘗試使用jQuery重定向到新URL時遇到問題，但不知何故它在這種特定情況下不起作用。我將jQuery與html和Djangobacklog結合使用，但我認為這些都不會導致顯示...
來自於 2024-04-01 21:03:17
0
1
341
相關專題
更多>
熱門推薦
熱門教學
更多>
相關教學
熱門推薦
最新課程
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網：公益線上PHP培訓，幫助PHP學習者快速成長！