2013-12-21 47 views
0

我怎樣才能 Set &自動刷新javascript輸入字段的值?Set&Auto使用javascript刷新輸入字段的值

我目前使用的是這樣的。

<script type="text/javascript"> 
var auto_refresh = setInterval(
function() 
{ 
$('#value5').fadeOut("fast").load('get_data.php').fadeIn("slow"); 
}, 5000); 
</script> 

<div id="value5" ></div> 

此工作正常,如果我在DIV id設置=值5,但如果我設置相同的ID爲輸入框這樣

<script type="text/javascript"> 
var auto_refresh = setInterval(
function() 
{ 
$('#value5').fadeOut("fast").load('get_data.php').fadeIn("slow"); 
}, 5000); 
</script> 

<input class="form-control input-lg" id="value5" type="text"> 

那麼它不表示的輸入框數據。

我甚至試過這種代碼Set the value of an input field

<input type="text" id="value5"> 

<script type="text/javascript"> 
var elem = document.getElementById("value5"); 
elem.value = "My default value"; 
</script> 

但顯示「我的默認值」的值,只有它一個時間,它不是讓人耳目一新。 我甚至試圖修改上述這樣的代碼

<input type="text" id="value5"> 

<script type="text/javascript"> 
var elem = document.getElementById("value5"); 
elem.value = "#value5"; 
</script> 

仍然沒有工作。

+0

'id'是爲了在使用類 –

+0

我正在使用唯一的ID,謝謝 – AMB

+0

*,但如果我設置輸入框相同的ID *暗示你不是。 –

回答

2

​​地方HTML到匹配元素(一個或多個)。如果您嘗試填充輸入文本框的值,請改爲使用.val()。另外,如果AJAX調用需要比您期望的更長的時間或者調整失敗,那麼使用setInterval()來重複異步AJAX調用可能會導致意想不到的問題。試試這個功能來代替,這將設置一個5秒超時重新執行只是一個成功的AJAX調用完成後:

function loadValue5() { 
    $.ajax({ 
     method: 'GET', 
     url: 'get_data.php', 
     success: function(responseText) { 
      $('#value5').fadeOut('fast', function() { 
       $('#value5').val(responseText).fadeIn('slow', function() { 
        setTimeout(loadValue5, 5000); 
       }); 
      }); 
     } 
    }); 
} 
loadValue5(); 

編輯:Here是一個工作的例子。

+1

這是我回答的[jsfiddle](http://jsfiddle.net/mU2ke/8/)。我將刪除它。這個答案涵蓋了一切。 –

+0

謝謝,idk最新錯誤,它在jsfiddle上工作,但不在我的盒子上,我有jquery和bootstrap js文件。儘管我原來的代碼工作,但不是這樣。 – AMB

+0

@AMB您是否在瀏覽器控制檯中收到腳本錯誤或網絡監視器中出現網絡錯誤? – Jesse

-1

設置div的值與設置輸入框的值不同。你要輸入框的值屬性設置:

$('#value5').attr('value').fadeOut("fast").load('get_data.php').fadeIn("slow"); 
+0

我試過這個,但它沒有工作要麼,謝謝 – AMB

+0

-1 for:'$('#value5')。attr('value')'將獲得「value5」元素的「value」屬性的值而不是設置任何東西;'.load ()'會填充一個元素的內部HTML而不是它的「value」屬性;並且用'.fadeIn('slow')'鏈接'.fadeOut('fast')'(即沒有合適的回調函數)是不會實現OP'期望的效果。 – Jesse

0

你只需要用null替換該值。 So $(「。form-name input).val(」「);應該刷新表單輸入元素。將它與SetTimeout結合起來,你就可以很好地去。