使用jQuery函数在JavaScript

-1

我使用提升变焦（镜头变焦功能）如图所示on this website。我有一个Radrotator，里面充满了Binary Images，我在旋转器的DataBound上给出了一个onclick事件。 Onclick我想根据从Rotator所有客户端点击的图像，在Rotator上方更改主要更大的图像。

屏幕上的图像确实会改变，但是，放大功能仍会显示第一张图像。

<img id="zoom_07" runat="server" src="small.jpg" alt="image" />

下面是两个javascript函数。第一种是使用elevatezoom放大图像，而第二种是在旋转器中的二进制图像点击。

<script type="text/javascript" > 
jQuery(document).ready(function ($) { 
    $("#zoom_07").elevateZoom({ 
     zoomType: "lens", 
     lensShape: "round", 
     lensSize: 200 
    }); 
}); 

function changeImage(url) { 

    var img = document.getElementById('zoom_07'); 
    img.src = url; 
    img.setAttribute('data-zoom-image', url); 
}

我如何更改放大镜客户端的形象呢？谢谢你对这件事的任何帮助。

来源

2013-03-11 Eric

你的问题有点不清楚，你说'我怎么能在JAVASCRIPT函数中调用这个jquery函数？'目前还不清楚你指的是什么jQuery功能。您所展示的代码中，除非出现任何内容，否则我没有看到任何特别的东西。请参阅“混淆jQuery名称空间”下的http://api.jquery.com/ready/部分。你准备好的函数所做的一切就是将你的jQuery变量转换为你的处理器方法中的$。如果你从ready函数获取代码并用jQuery替换$，它应该在你的javascript函数中工作。 – Rich 2013-03-11 23:13:44

我希望做的是调用$（“＃zoom_07”）。changeImage函数b/c内的elevateZoom数据缩放图像图像没有正确更改，因为img.src图像确实发生了变化。我编辑了一下我的问题。让我知道如果它仍然不清楚。 – Eric 2013-03-11 23:50:35

根据你的NEW描述，别人有这个问题，并得到最新版本：http://www.elevateweb.co.uk/q/discussion/5/rotatingsliding-images-zoom-on-the-container-div - 否则，我想我会建议你向该网站的帮助台发布问题; - 可能没有人会在这里调试别人的插件代码。 – 2013-03-12 13:10:58

This is the solution我跟着去了。我在旋转器中创建了图像标签（绑定到二进制图像），并在点击这些图像时更改了主图像。我当然必须将二进制图像转换为常规图像，然后保存它们。

来源

2013-03-12 19:53:19 Eric

jQuery is JavaScript，因此您已经在JavaScript函数中调用了它。它恰好是文档准备好的上的匿名函数。

function changeImage(url) { 
    var img = document.getElementById('zoom_07'); 
    img.src = url; 
    img.setAttribute('data-zoom-image', url); 

    $(img).elevatedZoom({ 
     zoomType: "lens", 
     lensShape: "round", 
     lensSize: 200 
    }); 
}

上述代码是您的事件处理程序，它已被更新以显示您希望调用函数来更新缩放。

来源

2013-03-11 23:11:47

谢谢！我会尝试这个 – Eric 2013-03-11 23:50:51

数据缩放图像仍然没有正确更新。我认为这将是修复。 – Eric 2013-03-12 01:45:27

我在设置data-zoom-image url后会做一个提示，并且该属性实际上正在改变，但不会更改该用户。放大镜只会显示以前的放大图像，而在img.src中定义的图像确实会改变。 – Eric 2013-03-12 01:48:35

我做了你点击什么一些广泛的假设和URL这里的源：

(function ($) { 
    // I invented this, use your element 
    $('#clickemeid').click(function() { 
     // I invented this "someattr" attribute, set to where you get that 
     var url = $(this).attr('someattr'); 
     $("#zoom_07").attr('src', url).attr('data-zoom-image', url).elevateZoom({ 
      zoomType: "lens", 
      lensShape: "round", 
      lensSize: 200 
     }); 
    }); 
})(jQuery);

NOW，让你想src和数据缩放图像之间进行切换的假设

(function ($) { 
    $('#zoom_07').click(function() { 
     var me = $(this); 
     var zoomurl = me.attr('data-zoom-image'); 
     var origurl = me.attr('src'); 
     me.attr('data-zoom-image', origurl).attr('src', zoomurl).elevateZoom({ 
      zoomType: "lens", 
      lensShape: "round", 
      lensSize: 200 
     }); 
    }); 
})(jQuery);

来源

2013-03-11 23:24:16

这些都没有工作。请参阅我修改的问题，因为我试图使它更清楚。 – Eric 2013-03-12 03:53:53

使用jQuery函数在JavaScript

回答

相关问题