将 jquery 函数从表单提交转换为 php 数组结果答案

【问题标题】：Converting jquery function from form submit to php array result将 jquery 函数从表单提交转换为 php 数组结果
【发布时间】：2013-04-15 20:37:51
【问题描述】：

我正在尝试使用 ImageResolver 插件并将其调整为与 php 数组一起使用。

将代码剥离到这里会返回没有表单的图像：

$(function(){

    var url = $('#url').val();
    ImageResolver.resolve(url, function(image){
        if (image) {
            $('#result').html('<img src="' + image + '" alt="">');
        } else {
            $('#result').html('<h2>No image found</h2>');
        }

});
});

我想调整它以在 php foreach 循环中工作。结果将在下一个class='result' div 上替换。 IE：页面加载了查询中的url后，该函数将解析url，如果找到则返回图片链接。我猜我需要使用(each) 或this()，但我想不通。

有人能指出正确的方向吗？

【问题讨论】：

你可以用 php echo 编写 js ...但我不太确定你在问什么
您在这里没有提供很多信息，但您需要做的是以某种方式将您的 php 代码与 javascript 结合起来。例如，您可以在 php foreach 循环中动态创建一个 javascript 数组。

标签： php jquery jquery-plugins foreach

【解决方案1】：

        <script src="ImageResolver/URI.min.js"></script>
        <script src="ImageResolver/ImageResolver.js"></script>



    <?
        $javascriptarray = 'var urls = [';
        $counter=0;
        foreach (array('http://www.apple.com/','http://github.com/','http://www.test.com/') as $url) 
        {
            if ($counter++ > 0) $javascriptarray .= ',';
            $javascriptarray .= '"'.$url.'"';
        }
        $javascriptarray .= '];';   
    ?>
<script>    
<?=$javascriptarray?>

//The ImageResolver will try all the resolvers one after the other
//in the order of their registration

//Resolvers that guess the image URL
ImageResolver.register(new FileExtensionResolver());
ImageResolver.register(new ImgurPageResolver());
ImageResolver.register(new NineGagResolver());
ImageResolver.register(new InstagramResolver());

//Resolvers that need extra ajax requests
ImageResolver.register(new ImgurAlbumResolver());
ImageResolver.register(new OpengraphResolver());
ImageResolver.register(new WebpageResolver());

//Some jQuery code to make the demo work
//Use a crossdomain proxy (required by some plugins)
$.ajaxPrefilter('text', function(options) {
    options.url = "http://furious-stream-4406.herokuapp.com?src=" + encodeURIComponent(options.url);
});

$(function(){


var length = urls.length,
url = null;
    for (var i = 0; i < length; i++) {
            url = urls[i];
            ImageResolver.resolve(url, function(image){
            if (image) {
                $('#result').append('<img src="' + image + '" alt=""><br>');
            } else {
                $('#result').append('<h2>No image</h2>');
                //$('#result').append('<h2>No image found for ' + url + '</h2>');
            }
        }); 
    }
}); 

</script>

当心 ImageResolver.resolve() 异步工作，你可能会得到意想不到的结果。在上一个调用完成之前再次调用 ImageResolver.resolve() 会将 $('#result').append('<h2>No image found for ' + url + '</h2>'); 中的 url 更改为您上次调用的 url，例如。为了防止这种情况，您需要在 for 循环中初始化一个新的解析器。见：Javascript prototypes and instance creation

【讨论】：