0

入力タイプの画像がたくさんあるフォームがあります。ユーザーが画像をクリックしたときに、ウェブページの場所を画像のURLに置き換える必要があります。

形は、

<form action='free.php' id='freeForm' method='post' autocomplete="off">
<?
for($j=1;$j<=5;$j++)
{
?>
<a href="<?=$url;?>" class="anchor-url"> <input type="image" src="<?=$img;?>" /></a>
 <?
 }
 ?>
 </form>

データベースからの$imgと$urlの値。

私のjqueryは、

$("#freeForm").submit(function()
    {
            var Form = { };
            Form['inputFree'] = $("#inputFree").val();

                    Form['freeTOS'] = '1';



              $('.anchor-url').click(function(e){
             e.preventDefault();
              alert($(this).attr('href'));
           });


            $.post('processFree.php', Form, function(data)
            {
                    if(data == "Success")
                    {
                            $("#FreeErrors").html('').hide();
                            swapToPane('paneSuccess');
                            return;
                    }

                    swapToPane('paneFree');
                    $("#FreeErrors").html(data).show();
            });

            return false;
    });

各画像をクリックすると、「http://au.yahoo.com」が表示されます。ただし、「http://au.yahoo.com」を各画像のURLに置き換えたいと思います。PHP変数$urlをこのフォームに渡すにはどうすればよいですか？何か案が？

ありがとう！

4

1 に答える 1

0

あなたが何を求めているのかを正しく理解していて、試したことがなければ、これはうまくいくはずです。基本的に、クリックイベントを各画像にバインドし、クリックすると、ウィンドウの場所がクリックされている要素のsrc属性の値に置き換えられます。input

$('input[type=image]').click(function(e){
  e.preventDefault();
  window.location.replace($(this).attr('src'));
});

編集

まず、アンカー要素にクラス名を追加する必要があります。

<form action='free.php' id='freeForm' method='post' autocomplete="off">
<?
for($j=1;$j<=5;$j++)
{
?>
<a href="<?=$url;?>" class="anchor-url"> <input type="image" src="<?=$img;?>" /></a>
 <?
 }
 ?>
</form>

あなたのJS：

$('.anchor-url').click(function(e){
  e.preventDefault();
  window.location.replace($(this).attr('href'));
});

アンカーリンクにクラスを追加した方法に注目してください。これはほとんど何でも名前を付けることができます。これにより、$（'。any-classname'）セレクターを使用して、jQueryでのみそのクラス名を持つ要素を選択できるようになります。

于 2012-07-03T00:23:36.257 に答える