copy text

[Frenske123]

Hallo

Ik wil bestaande tekst vanuit een input kopiëren naar een ander input als ik op een button klik op gewoon op de input
Dus inhoud van usermame naar usermame2 , dit voorbeeld heb ik niks aan omdat je moet typen , ik denk dat ik onFocus moet hebben.

value="Field 1" moet dus naar value="Field 2"

    <input  type="text"  name="usermame"  id="username_input"  value="Field  1"><br  /><br  />
    <input  type="text"  name="username2"  id="username_input2"  value="Field  2">

    <script>
      $(document).ready(function()  {
        $("#username_input").blur(function()  {
          $("#username_input2").val($("#username_input").val());
        });
      });
    </script>

 

[Aar]

$(document).ready(function() { 
    $('#username_input').change(function() {
      $('#username_input2').val($('#username_input').val());
    });
});

 

[Frenske123]

Bedankt voor reactie.
.
Nog iets van onFocus als ik op 1e veld klik? praktisch geen ervaring met javascript

 

[Aar]

Nee, anders had ik het wel geplaatst

 

[Frenske123]

Wellicht was ik niet helemaal duidelijk.

Onderstaande is wat ik graag had , klik op button en input wordt ingevuld

Hier is ook nog een voor mij overbodige to clipboard toegevoegd

Verder wil ik bijv 3 buttons met 3 inputvelden
(andere id?)

<input type="hidden" id="titleToCopy" value="xxx" />
&nbsp;&nbsp;&nbsp;
<input type="button" value="Copy" onClick="copyTitleOnClipboard()"/>
&nbsp;&nbsp;&nbsp; 

<!--<input type="button" value="Click Me to Exec Things" onclick="execThings()"/><br /><br /> -->
<input type="text" style="width:200px;" id="coipedText" />
<br />
<script>
$(document).ready(function(){
    setTimeout(function(){ execThings(); }, 5000);
});
function execThings() //This execute some operations and also calls other functions
{
    console.log(arguments.callee.name);
    //someDummy();
    copyTitleOnClipboard();
    //stopOriginalPlayer();
}


function copyTitleOnClipboard() // This function select and copies to the Operative System clipboard the content of the related text input
{
    console.log(arguments.callee.name);
    var titleInput = document.getElementById("titleToCopy");
    titleInput.focus(); // The function works good with or without this line
    titleInput.select();

    var r = document.execCommand("copy");
    r = r === true ? "has been" : "not";

    console.log("Title " + r + " copied to clipboard");
    var dest = document.getElementById("coipedText");
    dest.value = "Title " + r + " copied to clipboard";
    
}
</script>

 

[Aar]

Het is niet echt prettig om normale JavaScript functies te mengen met jQuery.
Kies daarom het één of het ander....

Als je een trigger wilt op een button, dan kan dat ook met jQuery:

$("form").submit(function(){
  // doe wat leuks.
});

 

[Frenske123]

Ik heb nou dit worden er uiteidelijk 4
Maar kan waarschijnlijk simpeler als iedere keer een functie/

Kopie waarde van button naar <input type="text" id='copy'/>

  <script>
function onSubmitClick() {
var box1 = document.getElementById('box1');
var copy = document.getElementById('copy');
copy.value = box1.value;
}
function onSubmitClick2() {
var box2 = document.getElementById('box2');
var copy = document.getElementById('copy');
copy.value = box2.value;
}


$(document).ready(function(){
$("#btn").click(function(){
/* Single line Reset function executes on click of Reset Button */
$("#form")[0].reset();
});});
</script>
<input type="hidden" id='box1' value="een"/>
<input type="hidden" id='box2' value="twee"/>

<input type="text" id='copy'/>
<button class="btn  btn-sm btn-danger" onclick='onSubmitClick(); return false'>Kies een</button> of 
<button class="btn btn-success btn-sm" onclick='onSubmitClick2(); return false'>Kies twee</button>

 

[Aar]

Vanwaar je keuze om jQuery en normaal JavaScript door elkaar heen te mengen?
Dan heb je die onClick-handler ook niet eens meer nodig.