将变量传递给Jquery函数

Question

我试图将按钮单击的内容传递给Jquery函数。

我的脚本使用的是“ Stephan Wanger的JBox插件”，这是创建我的弹出式窗口所特有的。

我的按钮代码：

<div class="imagehelp" id="imaint_help">
  <div onClick='javascript:clickMeImage()'>
    <div class="detailButton" id="TrafficM1">
  <a href="#?Record=<?php echo $row_m['RecordID']; ?>"><img src="nav/trafficeDetail_button.png" width="91" height="59" /></a>
    </div>
  </div>
</div>

我的Jquery函数：

function clickMeImage() {
var record = "<?php echo $_GET['Record'];?>";
console.log(record);
new jBox('Modal', {
  attach: '.imagehelp',
  width: 1000,
  height: 500,
  title: 'Traffic detail',
  theme: 'TooltipBorder',
  closeButton: 'title',
  draggable: 'title',
  trigger: 'click',
  animation: 'false',
  position: {
    x: 'center',
    y: 'center',
  },
  offset: {x: 15, y: -10},
  onCloseComplete: function() {
    this.destroy();
    $('#jBox-overlay').remove();
  },
  ajax: {
    url: 'traffic_detail.php?RecordID=record',
    reload: 'strict'
  }
});
}

非常感谢您的宝贵时间。

Answer 1

您从父元素触发功能。 我应该这样：

<?php
$row_m['RecordID'] = "something";
?>
<div class="imagehelp" id="imaint_help">
    <div onClick='javascript:clickMeImage("<?php echo $row_m['RecordID']; ?>")'>
        <div class="detailButton" id="TrafficM1">
            <img src="nav/trafficeDetail_button.png" width="91" height="59"/>
        </div>
    </div>
</div>
<script>
    function clickMeImage(mydata) {
        alert(mydata);
    }
</script>

如果要保留锚点，可以使用一个属性：

    <?php
$row_m['RecordID'] = "other-something";
?>
<div class="imagehelp" id="imaint_help">
    <div onClick='javascript:clickMeImage()'>
        <div class="detailButton" id="TrafficM1">
            <a href="#" data-record="<?php echo $row_m['RecordID']; ?>"> <img src="nav/trafficeDetail_button.png" width="91" height="59"/></a>
        </div>
    </div>
</div>
<script>
    function clickMeImage() {
        var el = document.querySelector('a');
        var mydata = el.getAttribute('data-record')
        alert(mydata);
    }
</script>