This is my code:

<h2></h2>
<input type="text" onkeyup="titleb(this.value)">
<script src=".3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script>
    (function($){
        function titleb( title ) {
            $('h2').html(title);
        }
    })(jQuery)
</script>

It supposed to take the input text and add it to the h2... but what I'm getting instead is:

Uncaught ReferenceError: titleb is not defined
    at HTMLInputElement.onkeyup

This is my code:

<h2></h2>
<input type="text" onkeyup="titleb(this.value)">
<script src="https://code.jquery./jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script>
    (function($){
        function titleb( title ) {
            $('h2').html(title);
        }
    })(jQuery)
</script>

It supposed to take the input text and add it to the h2... but what I'm getting instead is:

Uncaught ReferenceError: titleb is not defined
    at HTMLInputElement.onkeyup

• javascript
• jquery

• The function you are trying is not available at global scope – Jai Commented Sep 26, 2018 at 10:14
• oooooh, so how can I fix this? – MonicaLI8 Commented Sep 26, 2018 at 10:18
• Use jQuery to bind event $('elementSelector').on('keyup', function() { // your code here }); – Tushar Commented Sep 26, 2018 at 10:20
• That's what I did at first but the keyup was not counting the last character, I read here that on keyup is called later. – MonicaLI8 Commented Sep 26, 2018 at 10:25

4 Answers 4

Your function is nested

This is how to solve this:

<h2></h2>
<input type="text" onkeyup="titleb(this.value)">
<script src="https://code.jquery./jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script>
    let titleb
    (function($){
        titleb = (title) => {
            $('h2').html(title)
        }
    })(jQuery)
</script>

For people who don't understand

(val) => {} is same as function (val) {}

You can manage to have a namespace like:

onkeyup="myapp.titleb(this.value)"

and in your script use this:

<script>
    var myapp = (function($){
        return function titleb( title ) { // add a return
            $('h2').html(title);
        }
    })(jQuery)
</script>

You can simply have a function like here.

function titleb(title)
{

  $('h2').html(title);
}

<script src="https://code.jquery./jquery-3.1.0.js"></script><h2></h2>
<input type="text" onkeyup="titleb(this.value)">

The function called in the html must be in the global scope like this:

<script>
  function titleb( title ) {
    $('h2').html(title);
  }
</script>

Here is the working fiddle.

http://jsfiddle/e7z15tqf/