1

あるページにフォームがあり、送信すると別のフォームに移動します。変数を作成して数値を取得し、フォームに POST できるようにしたいと思います。

<!---these are the thumbs--->
<a id="155a" class="ThumbClick"href="#"><img src="images/thumb/5032.jpg" /></a>
<a id="156a" class="ThumbClick"href="#"><img src="images/thumb/5033.jpg" /></a>             
<a id="157a" class="ThumbClick"href="#"><img src="images/thumb/5034.jpg" /></a>

<!--these represent the number shown when thumb is clicked and the go to other form--->
<div id="call-to-action">
<h2 id="155c" class="image-num">5032</h2>
<h2 id="156c" class="image-num">5033</h2>
<h2 id="157c" class="image-num">5034</h2>
<form  id="quote" method="post" action="quote.php">
    <input type="hidden" name="cat" value="Revision Door" />
    <input type="hidden" name="des" value="" />
    <input type="submit" value="Get A Quote" />
</form>
</div>

<!---these represent the full size image--->
<img id="155b" class="hide1" src="images/fullsize/5032.jpg" />
<img id="156b" class="hide1" src="images/fullsize/5033.jpg" />              
<img id="157b" class="hide1" src="images/fullsize/5034.jpg" />



<!--this is the jquery that makes it all work--->
$(function () {
    $('.ThumbClick').click(function (eb) {
        var $idb = this.id.replace('a', 'b');

        eb.preventDefault();
        $('.show,#' + $idb).toggleClass('show');
    });
    $('.ThumbClick').click(function (ec) {
        var $idc = this.id.replace('a', 'c');

        ec.preventDefault();
        $('#' + $idc).toggleClass('show');
    });
    $('.ThumbClick').click(function () {
        $('#call-to-action').addClass('show');
    });
});

.image-num画像に対応し、親指をクリックするとテキスト (つまり 5033) が表示されます。ID ではなくフォームに (つまり 5033) を POST する必要があります。

4

1 に答える 1

1

jQuery を更新して以下を追加します。

$(function () {
    $('.ThumbClick').click(function (eb) {
        var $idb = this.id.replace('a', 'b');

        eb.preventDefault();
        $('.show,#' + $idb).toggleClass('show');
    });
    $('.ThumbClick').click(function (ec) {
        var $idc = this.id.replace('a', 'c');

        ec.preventDefault();
        $('#' + $idc).toggleClass('show');
        $('input[name="des"]').val($('#'+ $idc).html()); // <- Add Me
    });
    $('.ThumbClick').click(function () {
        $('#call-to-action').addClass('show');
    });
});

.click()これらすべてを 1 つの関数に凝縮することもできます。3 つ持つ必要はありません。

$(function () {
    $('.ThumbClick').click(function (e) {
        e.preventDefault();

        var $idb = this.id.replace('a', 'b');
        $('.show,#' + $idb).toggleClass('show');

        var $idc = this.id.replace('a', 'c');
        $('#' + $idc).toggleClass('show');
        $('input[name="des"]').val($('#'+ $idc).html()); // <- Add Me

        $('#call-to-action').addClass('show');
    });
});
于 2013-08-14T17:54:34.437 に答える