1

複数のリンクと 1 つのポップアップ FancyBox フォームを作成する方法を見つけようとしています。ユーザーが国のいずれかをクリックすると、その国がドロップダウン メニューで選択されるようにしたいと考えています。ドロップダウンで値を選択する方法がわからないことを除いて、すべてがうまく機能しています。誰でもこれで私を助けることができますか？前もって感謝します ：）。

 <script type="text/javascript">
jQuery(document).ready(function() {

$("a.country-form").fancybox({
        'scrolling' : 'no',
                'titleShow' : false,
                'onClosed'  : function() {
            $("#country_error").hide();
        }       
    });

    $("#country_form").bind("submit", function() {

        if ($("#country_country").val() == 0) {
            $("#country_error").show();
            $.fancybox.resize();
            return false;
        }

        $.fancybox.showActivity();

        $.ajax({
            type    : "POST",
            cache   : false,
            url     : "process.php",
            data    : $("#country_form").serializeArray(),
            success: function(data) {
                $.fancybox(data);
            }
        });

        return false;
    });
}
</script>

<a class="country-form" href="#country_form" >Submit textbook (Canada)</a>
<a class="country-form" href="#country_form" >Submit textbook (United States)</a>
<a class="country-form" href="#country_form" >Submit textbook (United Kingdom)</a>

<div style="display:none">
<form id="country_form" name="country_form" method="post" action="">
<p id="country_error">* There was a problem with your submission.</p>
<h1>Submit textbook in (COUNTRY HERE)</h1>
<label for="country">Country: </label>
<select name="country" id="country_country">
<option value="0">Country...</option>
<option value=1>Canada</option>
<option value=2>United States</option>
<option value=3>United Kingdom</option>
</div>
4

1 に答える 1

2

リンクに rel 属性を設定する

<a class="country-form" rel='1' href="#country_form" >Submit textbook (Canada)</a>
<a class="country-form" rel='2' href="#country_form" >Submit textbook (United States)</a>
<a class="country-form" rel='3' href="#country_form" >Submit textbook (United Kingdom)</a>

それから試してください

$("a.country-form").fancybox({
        'scrolling' : 'no',
         'onStart' : function(){
              $("#country_country").val($(this).attr('rel'));
          },
                'titleShow' : false,
                'onClosed'  : function() {
            $("#country_error").hide();
        }       
    });
于 2012-04-17T03:01:04.723 に答える