根据点击的图像填充贝宝形式

时间:2013-07-08 17:04:19

标签: jquery paypal

我想根据用户点击图片来填充贝宝表格。

$('a.thumbnail').click(function(){
var src = $(this).attr('href');

if (src != $('img#largeImg').attr('src').replace(/\?(.*)/,'')){
    $('img#largeImg').stop().animate({
        opacity: '0'
    }, function(){
        $(this).attr('src', src+'?'+Math.floor(Math.random()*(10*100)));
    }).load(function(){
        $(this).stop().animate({
            opacity: '1'
        });
    });
}
return false;
});

有2组图像,用户选择他想要的颜色,根据选择,贝宝菜单中的选择将会改变。例如 - color1 = black,color2 = Brown

<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="FEM2HYYCALHEE">
<table>
<tr><td><input type="hidden" name="on0" value="Chassis">Chassis</td></tr><tr><td><select       name="os0">
<option value="Black">Black </option>
<option value="Copper">Copper </option>
<option value="Gold">Gold </option>
</select> </td></tr>
<tr><td><input type="hidden" name="on1" value="Lens">Lens</td></tr><tr><td><select name="os1">
<option value="Green">Green </option>
<option value="Grey">Grey </option>
<option value="Brown">Brown </option>
<option value="Amber">Amber </option>
<option value="Yellow">Yellow </option>
</select> </td></tr>

下拉菜单不一定是可见的,最好在用户点击图像后点击“立即购买”,颜色将会更新。 See the current version of the page.

有什么建议吗?

1 个答案:

答案 0 :(得分:1)

最好的方法是使颜色选项隐藏值,然后在点击事件中更新它们,更像是这样:

形式:

<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_s-xclick">
    <input type="hidden" name="hosted_button_id" value="FEM2HYYCALHEE">
    <table>
        <tr>
            <td><input type="hidden" name="on0" value="Chassis">Chassis</td>
        </tr>
        <tr>
            <td>
                <input id="os0" type="hidden" name="os0" value="Black">
                <div id="os0_text">Black</div>
            </td>
        </tr>
        <tr>
            <td>
                <input type="hidden" name="on1" value="Lens">Lens
            </td>
        </tr>
        <tr>
            <td>
                <input id="os1" type="hidden" name="os1" value="Green">
                <div id="os1_text">Green</div>

            </td>
        </tr>
    </table>
</form>

JavaScript的:

$("#os0").val("Copper");
$("#os0_text").text("Copper");