1

フォームの送信と非表示のiframeの読み込みを同時に実行して、基本的に2つのことをトリガーできるようにしたいです。1。BingのAPIを使用して検索を実行し、2。入力に入力したテキストを読み上げます。

私は両方を独立して動作させていますが、同時には動作していません。

2つのフォームアクションを実行できないことを読みましたが、送信ボタンのonclickで何かを実行することはできますか？

これが私のコードです。現在2つのフォームがあります。これらを組み合わせて、1つのボタンをクリックしたときに両方のことを実行したいと思います。私はこれを行う方法について他の提案を完全に受け入れています！

    <html>
<head>
   <link href="styles.css" rel="stylesheet" type="text/css" />
<title>PHP Bing</title>
</head>
<body><form method="post" action="<?php echo $_SERVER['PHP_SELF'];?>"> 
Enter Search:<input type="text" id="searchText" name="searchText" value="<?php 
if (isset($_POST['searchText'])){
  echo($_POST['searchText']); }
else { 
echo('');
} ?>"/>

<input type="submit" value="Search!" name="submit" id="searchButton" />
<?php
if (isset($_POST['submit'])) {

$request = 
'http://api.bing.net/json.aspx?Appid=8CFD0925A6B1745AFE2F0F359DCD8D4D9DD6A5CE&sources=web&Web.Count=5&query=' . urlencode( $_POST["searchText"]);$response  = file_get_contents($request);
$jsonobj  = json_decode($response);
echo('<ul ID="resultList">');                    

foreach($jsonobj->SearchResponse->Web->Results as $value) {

echo('<li class="resultlistitem"><a href="' . $value->Url . '">'. $value->Title .'</a>');
echo('<p>'. $value->Description .'</p>');
echo('</li>');
}
echo("</ul>");
}
?>
</form>


<form method="post" action="http://vozme.com/text2voice.php" target="hiddeniframe">
<textarea id="text" cols="40" rows="1" name="text">
Enter Text
</textarea><br>
<button style="background-color:white;
background-image:
url(http://vozme.com/img/megaphone40x40w.gif);
background-position: top center;
background-repeat:no-repeat;
height: 48px; font-size:70%;
padding:4px 4px 4px 44px;">
</button>
</form>


 <iframe height="1" width="1" name="hiddeniframe" style="display: none;"></iframe>

</body>
</html>
4

1 に答える 1

1

ボタンクリックイベントをJSに登録し、1）iframeを読み込んで、2）フォームを送信する必要があります。（逆の場合、トップページがアンロードされるときにiframeのロードが中止される可能性があります）

簡略化した例（簡潔にするためにjQueryを使用）：

<form id="someform" action="/foo/bar" method="POST">
   <button id="yourbutton">should trigger two actions</button>
</form>
<iframe id="some_iframe"></iframe>

<script>
    $(document).ready(function(){ // register to run this when page is ready
        $('#yourbutton').click(function(){ // register to run this when #yourbutton clicked
             $('#some_iframe').load(function(){ // register to run this when #some_iframe loads
                 $('#someform').submit();
             });
             // and *then* load the iframe
             $('#some_iframe').setAttribute('src','http://example.com/some/URL');
        });
    });
</script>
于 2011-03-03T20:53:57.953 に答える