Ensure JavaScriptjQuery function always runs on page load

I tried all of the alternative examples I could find and couldn't get this to work. I may have it implemented incorrectly. Any help is greatly appreciated.

My issue:

I have a function that is meant to slideDown an alert if specific values in the are in the textarea.

This function works if the user types in the textarea, but the values are usually passed in from another page. How can I make it run without requiring that they interact with the text area?

Here's my example on JSFiddle: Example

And here is the HTML/JS code for easy reading:

HTML

<!doctype html>
 <html>
<head>
    <title>Alert Test</title>
</head>
<body>
    <div class="controls">
        <textarea name="q" class="span12"  id="textarea" rows="5">one:</textarea>
    </div>
    Test alert:
    <div class="alert alert-error" id="alert" name="alert" style="display: none;">
        This is a test alert.
        <a href="#" class="close" data-dismiss="alert">&times;</a>
    </div>
</body>
<script src=".js"></script>
<script src="textAreaReader.js"></script>
</html>

JS:

$(document).ready(function(){
$('#textarea').on('change keyup paste', function() {
var lines = $('#textarea').val();
var fields = ["one", "two", "three"];
var leng;
for (var i=0; i < fields.length; i++) {
  if (lines.indexOf(fields[i] + ':') !== -1){
    leng = 1;
  }
}
if (leng == 1){
    $("#alert").slideDown("fast"); //Slide Down Effect
  }else{
     $("#alert").slideUp("fast");  //Slide Up Effect  
  }
});
});

I tried all of the alternative examples I could find and couldn't get this to work. I may have it implemented incorrectly. Any help is greatly appreciated.

My issue:

I have a function that is meant to slideDown an alert if specific values in the are in the textarea.

This function works if the user types in the textarea, but the values are usually passed in from another page. How can I make it run without requiring that they interact with the text area?

Here's my example on JSFiddle: Example

And here is the HTML/JS code for easy reading:

HTML

<!doctype html>
 <html>
<head>
    <title>Alert Test</title>
</head>
<body>
    <div class="controls">
        <textarea name="q" class="span12"  id="textarea" rows="5">one:</textarea>
    </div>
    Test alert:
    <div class="alert alert-error" id="alert" name="alert" style="display: none;">
        This is a test alert.
        <a href="#" class="close" data-dismiss="alert">&times;</a>
    </div>
</body>
<script src="http://code.jquery./jquery-latest.js"></script>
<script src="textAreaReader.js"></script>
</html>

JS:

$(document).ready(function(){
$('#textarea').on('change keyup paste', function() {
var lines = $('#textarea').val();
var fields = ["one", "two", "three"];
var leng;
for (var i=0; i < fields.length; i++) {
  if (lines.indexOf(fields[i] + ':') !== -1){
    leng = 1;
  }
}
if (leng == 1){
    $("#alert").slideDown("fast"); //Slide Down Effect
  }else{
     $("#alert").slideUp("fast");  //Slide Up Effect  
  }
});
});

Share Improve this question edited May 14, 2015 at 14:19 asked May 14, 2015 at 14:15 zrdunlap 1773 silver badges12 bronze badges

What do you mean by the values in the textarea are "passed in from another page"? Do you have a script that updates the textarea? – Katrina Commented May 14, 2015 at 14:18
The site I have is an internal pany search site. We give the users the option to go to a separate page an save their searches or extract some content based on the searches in specific formats. Since they ran the search on the initial page, the one I need to make the JS run gets the search passed in. Hope this makes sense. – zrdunlap Commented May 14, 2015 at 14:21

Add a ment |

1 Answer 1

Sorted by: Reset to default 5

Assigning the function to a variable lets you pass it to the textarea handler and run it on page load.

$(document).ready(function () {
    var slide = function () {
        …
    };
    $('#textarea').on('change keyup paste', slide);
    setTimeout(slide, 500);
});

Sample.

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

Ensure JavaScriptjQuery function always runs on page load - Stack Overflow

1 Answer 1

与本文相关的文章

评论列表(0)