Question

我有一个图像库。当用户点击图像时，页面会滚动并显示图像以及标题，描述和＆＃34;转到＆＃34;按钮。除了为“转到”按钮传递变量外，所有工作都很好。我需要将用户ID传递给JS脚本。这是部分PHP代码：

<img src=<?php echo $image_finder?>
 height=<?php echo $img_height?> 
 width=<?php echo $img_width?>     
 class="superbox-img" 
 data-img="<?php echo $image_finder?>" 
 title="<?php echo $artist_name?>" 
 alt="<?php echo $artist_about ?>" 
 location="<?php echo $artist_id?>" >

PHP代码在foreach循环中。可能有一百张图像，但我需要获取所选图像的ID（位置参数）。

在PHP页面的底部，我将JS文件和以下调用包含在JS文件和函数中。

 var pagefunction = function() {
    $('.superbox').SuperBox();

};

loadScript("js/plugin/superbox/superbox.min.js", pagefunction);

在JS文件中，我需要获取location参数并传入HREF。我已经在main.php？location =（变量）之后标记了变量需要大约8行的位置。任何帮助表示赞赏。谢谢，格兰特

    function(a) {
    a.fn.SuperBox = function() {
        var b = a('<div class="superbox-show"></div>'),
            c = a('<img src="" class="superbox-current-img">
                <div id="imgInfoBox" class="superbox-imageinfo inline-block"> 
                <h1>Image Title</h1>
                <span><p><em>http://imagelink.com/thisimage.jpg</em></p>
                <p class="superbox-img-description">Image description</p>
                <p><a **href="main.php?location=' + location + '**" class="btn btn-primary btn-sm">Go to    Artist</a> 
                <a href="javascript:void(0);" class="btn btn-danger btn-sm">Delete</a></p></span> </div>'),
            d = a('<div class="superbox-close txt-color-white"><i class="fa fa-times fa-lg"></i></div>');
            b.append(c).append(d);
            a(".superbox-imageinfo");
                return this.each(function() {
            a(".superbox-list").click(function() {
                $this = a(this);
        var d = $this.find(".superbox-img"),
                    e = d.data("img"),
                    f = d.attr("alt") || "No description",
                    g = e,
                    h = d.attr("title") || "No Title";
                    l = d.attr("location") || "No Location";
                c.attr("src", e), a(".superbox-list").removeClass("active"),   $this.addClass("active"), c.find("em").text(g), c.find(">:first-child").text(h), c.find(".superbox-img-description").text(f), 0 == a(".superbox-current-img").css("opacity") && a(".superbox-current-img").animate({
                    opacity: 1
                }), a(this).next().hasClass("superbox-show") ? (a(".superbox-list").removeClass("active"), b.toggle()) : (b.insertAfter(this).css("display", "block"), $this.addClass("active")), a("html, body").animate({
                    scrollTop: b.position().top - d.width()
                }, "medium")
            }), a(".superbox").on("click", ".superbox-close", function() {
                a(".superbox-list").removeClass("active"), a(".superbox-current-img").animate({
                    opacity: 0
                }, 200, function() {
                    a(".superbox-show").slideUp()
                })
            })
        })
    }
}(jQuery);

Answer 1

<强>分号！

<img src=<?php echo $image_finder; ?> height=<?php echo $img_height; ?> width=<?php echo $img_width; ?>     class="superbox-img" data-img="<?php echo $image_finder; ?>" title="<?php echo $artist_name; ?>" alt="<?php echo $artist_about; ?>" location="<?php echo $artist_id; ?>" >

修改的的报价！

<img src="<?php echo $image_finder; ?>" height="<?php echo $img_height; ?>" width="<?php echo $img_width; ?>" class="superbox-img" data-img="<?php echo $image_finder; ?>" title="<?php echo $artist_name; ?>" alt="<?php echo $artist_about; ?>" location="<?php echo $artist_id; ?>" >

Answer 2

解决方案1 

将您的javascript代码放在PHP页面中并回显变量值，即：

c = a('<img src="" class="superbox-current-img">
        <div id="imgInfoBox" class="superbox-imageinfo inline-block"> 
        <h1>Image Title</h1>
        <span><p><em>http://imagelink.com/thisimage.jpg</em></p>
        <p class="superbox-img-description">Image description</p>
        <p><a href="main.php?location=<?php echo urlencode($variable) ?>" class="btn btn-primary btn-sm">Go to    Artist</a> 
        <a href="javascript:void(0);" class="btn btn-danger btn-sm">Delete</a></p></span> </div>'),
    d = a('<div class="superbox-close txt-color-white"><i class="fa fa-times fa-lg"></i></div>');

解决方案2：

在你的JS文件中执行类似

的操作

var MYAPP = MYAPP || (function(){
var _vars = {};

return {
    init : function(variables) {
        _vars = variables;
        // ... you other code
    },
    superBox : function() {
        //.. your other code
        c = a('<img src="" class="superbox-current-img">
        <div id="imgInfoBox" class="superbox-imageinfo inline-block"> 
        <h1>Image Title</h1>
        <span><p><em>http://imagelink.com/thisimage.jpg</em></p>
        <p class="superbox-img-description">Image description</p>
        <p><a href="main.php?location=' + _args.yourVariable + '" class="btn btn-primary btn-sm">Go to    Artist</a> 
        <a href="javascript:void(0);" class="btn btn-danger btn-sm">Delete</a></p></span> </div>'),
    d = a('<div class="superbox-close txt-color-white"><i class="fa fa-times fa-lg"></i></div>');
        //.. your other code
    }
};
}());

然后在你的php文件中：

<script type="text/javascript" src="myfile.js"></script>
<script type="text/javascript">
   MYAPP.init({myVariable: "<?php echo urlencode($myVariable) ?>"});
   MYAPP.superBox();
</script>

将变量从PHP传递到Javascript for Image文件

2 个答案: