2014-10-09 100 views
0

假設我有3個文本框和3個按鈕 所以我想是我點擊任何一個文本字段,當我點擊一個按鈕存儲在按鈕數值超出文本字段我有以前點擊這裏是我試過的代碼。需要一個jQuery代碼:

<html> 
    <head> 
    </head> 


    <body><button class="b"></button> 
    <button class="a">abc</button> 
    <button class="a">def</button> 
    <button class="a">ghi</button> 

    <div class="fill" id="f1"><input type="text" value=""> aaaa</div> 
    <div class="fill" id="f2"><input type="text" >bbbb</div> 
    <div class="fill" id="f3"><input type="text" >ccc</div> 


    <script src="js/jquery.min.js"></script> 
    <script type="text/javascript"> 

$('.fill').each(function(index, element) { 
      $(this).click(function(){ 
       var temp = $(this).attr('id'); 
       $('.b').click(function(){ 
        alert($('.b').val()) 

       $('.a').each(function(){ 
        $(this).click(function(){ 
        $('.fill').val()=$(temp).val() 
        }); 
       }); 
      }); 
});}) 

</script> 
</body> 

'

+1

不明確以「我點擊任何一個文本字段,當我點擊一個按鈕的值。 ..'這句話,你能否詳細說明一下共享html的例子? – 2014-10-09 11:47:28

+0

我明白你的意思,我不得不讀上百遍時間:) – enguerranws 2014-10-09 11:48:07

+4

這JS代碼是一個爛攤子:) – enguerranws 2014-10-09 11:48:59

回答

3

我認爲你需要這段JavaScript代碼:

var activeInput = undefined; 

$('.fill input').on('click', function() { 
    activeInput = this; 
}); 

$('.a').on('click', function() { 
    if(!activeInput) return; 
    $(activeInput).val($(this).text()); 
    // optional: 
    // activeInput = undefined; 
}); 

它能做什麼:你打一個輸入,並將其保存在您點擊在activeInput VAR哪個輸入。然後,當您按下按鈕時,它會將其值(或文本值)傳遞到輸入字段。如果您不希望用戶連續擊中其他按鈕,可以選擇性地重新設置activeInput變量。

JSFiddle example here

+2

+1正確認識問題的陳述,並證明是正確的答案:),我不明白它:( – 2014-10-09 11:52:59

0

這應做到:

var activeFill; 
 

 
$('.fill input').on('click',function() { 
 
    activeFill = $(this); 
 
}); 
 

 
$('button').on('click',function() { 
 
    if (activeFill !== 'undefined') { 
 
     var val = $(this).html(); 
 
     $(activeFill).val(val); 
 
    } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<button class="b"></button> 
 
<button class="a">abc</button> 
 
<button class="a">def</button> 
 
<button class="a">ghi</button> 
 

 
<div class="fill" id="f1"><input type="text" value=""> aaaa</div> 
 
<div class="fill" id="f2"><input type="text" >bbbb</div> 
 
<div class="fill" id="f3"><input type="text" >ccc</div>

+0

你'如果(activeFill!==「未定義」){'失敗只爲第一時間,直到你點擊任何的文本,點擊任何文本後第一時間就永遠不會失敗 – 2014-10-09 11:51:26

+0

這想法如果它是不確定不打擾運行代碼的其餘部分 – Turnip 2014-10-09 11:52:31

0

這裏我寫了一個工作示例:

$('button.a').mousedown(function (e) { 
    e.preventDefault(); 
    var input = $('input:focus'); 
    if (input.length == 1) { 
     input.val($(this).text()).focus(); 
    } 
}); 

Live demo

0

您不必使用每個。 .click()方法被添加到每個集合中。所以
$('.fill').click() 相同

$('.fill').each(function() { 
    $(this).click() 
}); 

這就是說,保持它的簡單

/* store the previous clicked input text */ 
var previous = null;  
$('.fill input').click(function() { 
    previous = this; 
}); 

/* change text on button click */ 
$('.a').click(function() { 
    if (previous == null) 
     return; 
    $(previous).text($(this).text()); 
}); 
+0

沒錯這就是一個恥辱預覽不顯示代碼顏色;。)更正 – Dionys 2014-10-09 11:57:35