[英]How to pass values of form input fields to a script using AJAX/jQuery?
我當前的代碼是這樣的。
index.php
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="ajax.js"></script>
<select id="dropdown_id">
<option value="one.php">One</option>
<option value="two.php">Two</option>
</select>
<div id="workspace">workspace</div>
一個.php
$arr = array ( "workspace" => "One" );
echo json_encode( $arr );
two.php
$arr = array( 'workspace' => "Two" );
echo json_encode( $arr );
JS
jQuery('#dropdown_id').live('change', function(event) {
jQuery.getJSON($(this).val(), function(snippets) {
for(var id in snippets) {
// updated to deal with any type of HTML
jQuery('#' + id).html(snippets[id]);
}
});
});
上面的代碼運行完美。 當我從下拉列表中選擇一個時,one.php將使用JSON加載到工作區DIV中。 當我選擇Two時,two.php將加載到工作區DIV中。
我接下來要做什么:
Now I want to add another dropdown in index.php:
<select id="myinput" name="alpha">
<option value="a">a</option>
<option value="b">b</option>
<option value="a">c</option>
<option value="b">d</option>
</select>
當用戶從第一個下拉菜單中選擇任何選項時,該腳本(值)應在工作區DIV中加載第二個下拉菜單的值。
例如:
當我從第一個下拉菜單中選擇一個時 :
一個.php
$arr = array ( "workspace" => $_GET['alpha'] ); // Should load 'a'
echo json_encode( $arr );
現在,當我從第二個下拉菜單中選擇b時 :
一個.php
$arr = array ( "workspace" => $_GET['alpha'] ); // Should load 'b'
echo json_encode( $arr );
希望它能對您有所幫助:
一個.php
$arr = array ( 'workspace' => 'One');
if(isset($_GET['myinput_val']))
{
$arr['workspace'] = $_GET['myinput_val'];
}
echo json_encode( $arr );
JS
$('#myinput').live('change', function(event) {
$.getJSON("one.php", { myinput_val: $(this).val() } , function (snippets) {
for(var id in snippets) {
// updated to deal with any type of HTML
$('#' + id).html(snippets[id]);
}
});
});
怎么樣:
$('#mypage').bind('change', function () {
var self = $(this);
$('#workspace').load('/' + self.val(), {
input: $('#myinput').val();
});
});
然后,您的PHP文件將查看$ _POST ['input']值以輸出該值。
<?php echo $_POST['input']; ?>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.