kiedy funkcja ma być w $ (dokument) .ready ()

Po prostu tego nie rozumiem. Szukałem i przeszukiwałem, ale po prostu nie mogę zrozumieć, co jest „właściwe”.

Istnieją trzy przykłady.

1)Fiddle 1.0 Mamy tutajhtml zonlick="function" ijavascript funkcjonuje tam również, co działa dobrze

 <span class="classic one"   onclick="someFunction(this,'one')">CLICK HERE</span>

 <script type="text/javascript">
    function someFunction(obj,nr) {
        var string = $(obj).attr('class');
        $('.result').text( string );
    }
</script>

2)Skrzypce 2.0 Następnie, gdy przenoszę funkcję do sekcji skryptu (rodzaj przeniesienia jej do pliku .js), pojawia się błąd „ReferenceError: someFunction nie jest zdefiniowany”

TO JEST, GDZIE POCZĄTEK PYTANIA

3)Skrzypce 3 Teraz mam funkcję w wywoływaniu dokumentu z .on (kliknięcie, które zawsze działa dobrze. Ta funkcja wywołuje inną funkcję, która jest poza docuemnt.ready (), a także działa dobrze.

Więc pytanie. Kiedy muszę zdefiniować funkcje, gdzie I DLACZEGO to zawsze działa?

Dziękuję Ci!

Cały kod z przykładu 3) wygląda tak:

<div class="result">result</div>

    <span class="classic one"   onclick="someFunction(this,'one')">CLICK HERE</span>
    <span class="classic two"   onclick="someFunction(this,'two')">CLICK HERE</span>
    <span class="classic three" onclick="someFunction(this,'three')">CLICK HERE</span>
    <span class="classic four"  onclick="someFunction(this,'four')">CLICK HERE</span>

<div class="ready">ready</div>


<span class="callOtherFunction">Call other function</span>


<script type="text/javascript">
    $(document).ready(function(){
        $('.ready').text( 'dom is ready' );

        function someFunction(obj,nr) {
                var string = $(obj).attr('class');
                $('.result').text( string );
            }

         $( "span.callOtherFunction" ).on({
            click: function() {
                $(this).css("color","red");
                $(this).addClass("xyz");
                otherFunctionCallingFunction($(this));
            }
        });

    });

    function otherFunctionCallingFunction($me) {
        $('.callOtherFunction').append( ' --> ' + $me.attr('class') );
    }
</script>

questionAnswers(2)

yourAnswerToTheQuestion