我需要在插件选项中放置一个jQuery值或变量

Question

我需要在插件选项中放置一个jQuery值或变量

我的剧本

$(document).ready(function() {
    // var bannerheight =  580;
    if ($(window).width() < 2100) {
      var bannerheight =  410;

      var opts = JSON.parse($('#revolutionSlider').attr('data-plugin-options'));
      opts.startheight = bannerheight; alert(opts.startheight);

      $('#revolutionSlider').attr('data-plugin-options', JSON.stringify(opts));
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="revolutionSlider" style="background:grey;" data-plugin-options='{"startheight": 430}' data-plugin-revolution-slider></div>

我需要将jQuery脚本中的横幅值放在data-plugin-options='{"startheight": 430}'中。这不是值“430”我需要来自jQuery脚本的值

Answer 1

你需要：

1. 将选项JSON解析为JS对象
2. 更改值
3. 将对象序列化为JSON
4. 将JSON设置为属性值。

以下应该有效。在你计算bannerheight之后这样做。

var opts = JSON.parse($('#revolutionSlider').attr('data-plugin-options'));
opts.startheight = bannerheight;
$('#revolutionSlider').attr('data-plugin-options', JSON.stringify(opts));

Answer 2

这可能是hackish方式，但有效

1.记住当前值2.更改值并再次设置

let raw_rev_options = jQuery('#revolutionSlider').attr('data-plugin-options');
let rev_options = JSON.parse(raw_rev_options);
rev_options.startheight = bannerheight;
jQuery('#revolutionSlider').attr('data-plugin-options', JSON.stringify(rev_options));

Answer 3

尝试在其他条件之后将其添加到脚本中，并检查是否有效。

$("#revolutionSlider").attr('data-plugin-options',"{'startheight':"+bannerheight+" }");