2014-10-09 65 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