包含選項的拆分數據字符串

我已經在我的網站上實現了共享按鈕，它將來自數據屬性的單獨組件（在下面的示例中）傳遞給每個社交網站。包含選項的拆分數據字符串

HTML

<span data-title="Stackoverflow" data-description="Website" data-media="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon.png?v=c78bd457575a" data-url="url":"https://stackoverflow.com/questions/" class="share">

腳本

var base = $('.share'), 
    thisUrl = window.location.href, 
    thistitle = base.data('title'), 
    thisdescription = base.data('description'), 
    thismedia = base.data('media');

我寧願做，將有像跨度只有一個數據串我放在一起下面包含了所有的選項然後我可以拆分並傳遞給：

title = options.title 

description = options.description 

media = options.media 

url = options.url

HTML：

<span data-opt="{"options":{"title":"Stackoverflow","description":"Website","media":"https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon.png?v=c78bd457575a","url":"https://stackoverflow.com/questions/"}}" >

帶有指向我朝着正確的方向或任何通知任何幫助將不勝感激。

來源

2017-05-28 Ross Anderson

將外部屬性值引號更改爲單引號，並使用jQuery data（）獲取整個對象。

只要字符串是有效的JSON，數據（）會自動解析它的對象/數組

var data = $('span[data-opt]').data('opt'); 
 
console.log('Title is', data.options.title);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span data-opt='{"options":{"title":"Stackoverflow","description":"Website","media":"https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon.png?v=c78bd457575a","url":"https://stackoverflow.com/questions/"}}' >

來源

2017-05-28 12:20:22 charlietfl

這是很簡單,,感謝查理 –

還要注意可以得到一個單一的對象來自多個'data-'屬性（就像在你的第一個例子中），通過不提供密鑰...... var data = $（'span'）。data（）'...'console.log（data.description） ' – charlietfl

包含選項的拆分數據字符串

回答

相關問題