獲取文本框和下拉列表的當前值並使用jquery輸出它們

我想要做的是同時輸出文本框值和下拉列表選定值。原因是我想最終通過一個MySQL數據庫表進行排序。現在......當我更改文本框時，它將添加到下拉列表值中，這正是我想要的。但是，當我更改下拉列表值時，它將無法識別文本框的值，並在文檔被加載爲值時恢復到該值。我如何獲取這兩個值並回顯它們，並且能夠在我對文本框「鍵入」或「更改」下拉列表值時更改它們並查看更改。提前致謝。獲取文本框和下拉列表的當前值並使用jquery輸出它們

jQuery的

$(document).ready(function() { 
    var type_term = $("#type option:selected").text() 
    var search_term = $("#search").val() 
    $.post('search_db.php',{type_term:type_term, search_term:search_term}, function (data) { 
     $('#search_results').html(data) 
    }); 
    $('#search').keyup(function() { 
     var search_term = $("#search").val() 
     $.post('search_db.php',{type_term:type_term, search_term:search_term}, function (data) { 
      $('#search_results').html(data) 
     }); 
    }); 
    $('#type').change(function() { 
     var type_term = $("#type option:selected").text() 
     $.post('search_db.php',{type_term:type_term, search_term:search_term}, function (data) { 
      $('#search_results').html(data)  
     }); 
    }); 
});

HTML

<input id="search" type="text" value="Value"> 

<select id="type"> 
<option>Type1</option> 
<option>Type2</option> 
</select> 

<div id="search_results"></div>

searchdb.php

$type_term = $_POST['type_term']; 
$search_term = $_POST['search_term']; 

echo $type_term; 
echo $search_term;

來源

2013-05-05 user2145975

您正在顯式聲明變更函數中的值，這使得它們成爲本地範圍，並且其中不能被其他函數訪問。從'change'和'keyup'函數中刪除'var'聲明。這應該工作。 [你的代碼的小提琴，不按預期工作]（http://jsfiddle.net/vfsSF/）...然後，[小提琴去除var聲明，按預期工作]（http：// jsfiddle達網絡/ AJGF8 /） – Ohgodwhy 2013-05-05 21:55:37

嘗試設置變量對每個事件都表單元素，而不僅僅是一個，你是改變。

$(document).ready(function() { 
var type_term = $("#type option:selected").text() 
var search_term = $("#search").val() 
$.post('search_db.php',{type_term:type_term, search_term:search_term}, function (data) { 
    $('#search_results').html(data) 
}); 
$('#search').keyup(function() { 
    var search_term = $("#search").val() 
    var type_term = $("#type option:selected").text() 
    $.post('search_db.php',{type_term:type_term, search_term:search_term}, function (data) { 
     $('#search_results').html(data) 
    }); 
}); 
$('#type').change(function() { 
    var search_term = $("#search").val() 
    var type_term = $("#type option:selected").text() 
    $.post('search_db.php',{type_term:type_term, search_term:search_term}, function (data) { 
     $('#search_results').html(data)  
    }); 
}); 
});

來源

2013-05-06 02:08:31 Source

獲取文本框和下拉列表的當前值並使用jquery輸出它們

回答

相關問題