All geek questions in one place

Problem with javascript function when using jQuery

I am very new to Javascript and recently started playing with jquery. I have a Javascript function that when used by itself in my project works flawlessly. as shown below. * UPDATE * these 2 functions are declared after the tag <input>and still cause the same error document.getElementById("name_first") is null when I add jquery code.

<script type="text/javascript">

function printSymbol(symbol) {  document.getElementById('name_first').value
+= symbol; };

function deleteSymbol() {  document.getElementById('name_first').value
= document.getElementById('name_first').value.substr(0, document.getElementById('name_first').value.length
- 1); };

</script>

However, when I add my jquery to the same element, my existing javascript function returns an error: document.getElementById ("name_first") is null

The jQuery function works fine and is declared below.

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

$("input[type=text]").autoSuggest("search_data.php", {selectedItemProp: "name", searchObjProps: "name", minChars: 2});

});
</script>

::::: UPDATE

I call the printSymbol function from a flash keyboard with the following ActionScript code that works fine.

getURL("javascript:printSymbol('" + evnt.data + "');");

, , , jquery, .

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

$("input[type=text]").autoSuggest("search_data.php", {selectedItemProp: "name", searchObjProps: "name", minChars: 2});

function printSymbol(symbol) {
    $('name_first').append(symbol)
};

function deleteSymbol() {
    $('name_first').text( $('name_first').text().substr(0, $('#name_first').text().length - 1))
};
});
</script>

, , -, : getURL("javascript:printSymbol('" + evnt.data + "');"); . jquery?

, :).

UPDATE

, ( html)

<?php session_start(); ?>
<?php require_once('Connections/db.php'); ?>


          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
          <html>
          <head>
          <title>None</title>
          <!-- Include Javascript functions and css files -->
          <link href="autoSuggest.css" rel="stylesheet" type="text/css" />
          <script type="text/javascript" src="jquery.js"</script>
          <script type="text/javascript" src="jquery.autoSuggest.js"</script>

            <script type="text/javascript">
            $(document).ready(function() {
            $("#name_first").autoSuggest("search_data.php", {selectedItemProp: "name", searchObjProps: "name", minChars: 2});
             });
            </script>

          </head>

          <body>

          <form action="" method="get" name="form1" target="_self" id="form1">
          <input name="name_first" type="text" id="name_first" value="" size="25" maxlength="50" />
          </form>

<script type="text/javascript"> 

function printSymbol(symbol) {  
$("#name_first").val($("#name_first").val() + symbol); 
} 

function deleteSymbol() {  
$("#name_first").val($("#name_first").val().substr(0,$("#name_first").val().length 
- 1)); 
} 

</script>


     <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="582" height="241">
    <param name="movie" value="images/KB_NoNum.swf" />
    <param name="quality" value="high" />
      <embed src="media/KB_With_Space.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="582" height="241">  </embed>
    </object>
    </body> 
    </html>

AUTOCOMPLETE FROM BASSISTANCE.

im (NOT).

  <script>
  $().ready(function() {
    $("#name_first").change().autocomplete("data_search.php", {
        width: 260,
        selectFirst: false
    });
   });

  </script>

<script type="text/javascript"> 

function printSymbol(symbol) {  
$("#name_first").val($("#name_first").val() + symbol); 
} 

function deleteSymbol() {  
$("#name_first").val($("#name_first").val().substr(0,$("#name_first").val().length 
- 1)); 
} 

</script>

.., .

, printSymbol, , , ... confused

, , , , .

jQuery ( )

    <script>
  $(document).ready(function() {
   $('.selector').bind('autocompletechange', function(event, ui) {
    $("#name_first").change().autocomplete("data_search.php", {
        width: 260,
        selectFirst: false
    });
   });
   });

  </script>

UPDATE http://jquery-ui.googlecode.com/svn/tags/1.8rc1/ui/jquery-ui.js

    <script>
  $(document).ready(function() {
    $("input").autocomplete({
     source: "search_data.php"});

   });
  </script>

, :( keypress, , .

+3
4

, ? , ? :

<input type="text" name="name_first" id="name_first" />

, id , "name_first".

jQuery , <input> type="text".

, <input type="text" name="name_first" /> jQuery, document.getElementById('name_first').

============================================ >

, autosuggest onKeyDown, , , .

- , javascript, "". ( ).

, , , javascript (), , .

, ( ) ( firebug, javascript), , . keyChange() enter ( , ). , - . - , ( ) jQuery (Google ).

, <input> , console.log() printSymbol. :

function printSymbol(symbol) {
    console.log('symbol received: ' + symbol);
    console.log('name_first.val (pre): ' + $("#name_first").val());
    $("#name_first").val($("#name_first").val() + symbol); 
    console.log('name_first.val (post): ' + $("#name_first").val());
}

, . , , , .

+1

/ $(document).ready(function() ,

jquery:

<script type="text/javascript"> 

function printSymbol(symbol) {  
$("#name_first").val($("#name_first").val() + symbol); 
} 

function deleteSymbol() {  
$("#name_first").val($("#name_first").val().substr(0,$("#name_first").val().length 
- 1)); 
} 

</script>

, , jquery, , ex:

$("#suggest1").focus().autocomplete(cities);

id suggest1 -, - , , , . localdata.js. .

, , :

$("#singleBirdRemote").change().autocomplete("search.php", {
        width: 260,
        selectFirst: false
    });

- . . . , .

:

 <script>
  $(document).ready(function() {
   $('.selector').bind('autocompletechange', function(event, ui) {
  ...
   });
   });

  </script>
+1

document.ready?? jquery ocde

$(document).ready(function() {

.... Jquery code goes here 


});


function printSymbol(symbol) {
    $('#name_first').append(symbol);
}

function deleteSymbol() {
    $('#name_first').text( $('name_first').text().substr(0, $('#name_first').text().length - 1);
}
0

I saw strange problems with this when functions did not have final half colonies, such as:

<script type="text/javascript"> 

function printSymbol(symbol) {  document.getElementById('name_first').value 
+= symbol; }; 

function deleteSymbol() {  document.getElementById('name_first').value 
= document.getElementById('name_first').value.substr(0, document.getElementById('name_first').value.length 
- 1); }; 

</script>
0
source

Source: https://habr.com/ru/post/1734036/

More articles:


All Articles