开发者

Is there a way to reference an input element immediately before a javascript function WITHOUT using its ID?

开发者 https://www.devze.com 2023-02-06 10:40 出处:网络
When calling a function from a page in javascript, is there a way to reference the element immediately before the function WITHOUT its ID? for example,

When calling a function from a page in javascript, is there a way to reference the element immediately before the function WITHOUT its ID? for example,

<select>...</select>

<script type="text/javasc开发者_开发问答ript">
    my_function(previous_element);
</script>

is there a way to send the select element to my_function() without using the ID of the select element?

Thanks in advance.

Edit: More information on what I am trying to do.

I'm using a rails plugin that generates a copy of a group of form elements with a unique ID for each element. I'm trying to call a function for a particular form (select) element within the group - ideally I would add onload to the select element, but that doesn't exist for form elements. calling the function from within the page is the best I can come up with. Since the elements are copied using ajax (IOW an "Add new address" kind of thing), if I added an element with a known ID it would be copied as well (and create multiple elements with the same ID, and confusion). I know it's really messy but I'm having difficulty coming up with another solution, and this plugin is already well integrated into my project.


Since you are using the nested_forms gem, and you want to access a specific element after it is dynamically added to the form, could you try to do the following?

In the head section of your HTML, after you included the nested_form.js file, you put this javascript (you can use the rails content_for method or put in another javascript file and include it):

<script type="text/javascript">
  $(function() {
    $('form a.add_nested_fields').live('click', function() {

      var form = $(this).parent(); // this is the form

      // you can now traverse the DOM searching for the specific element
    });
  });
</script>

I haven't tested the code, but I think the event will execute after the children fields have been added. Since you can access the form inside the event, you can traverse the DOM to search for the specific element that you are trying to access.

Hope this helps!


I do not think you can get the input before a script block without any reference at all since as far as I know the script running in the script block will never know where in the code the script block resides and I do not think there exist any pointer to the script block.

You might need be able to use an ID on the script block and from there use the jQuery functions from Chris Kooken's answer


I've had to tackle this problem in an environment where I can't control any content except the script-tag itself (read: ads). The solution I'm currently using is the following idea:

  1. Include a file rather than an inline script.
  2. Put a variable inside this file that contains the url you will use for the src-attribute. If this is not know at code-writing time, you'll have to respond to the request for this file with some server generated content rather than a static file. (It can still be mostly static/templated, but you'll have to read the url from the actual request rather than hardcoding it).
  3. Find the script-tag itself by searching for the one with a src-attribute that equals the request url variable that you put into your script in step 2.
  4. Traverse the DOM one step back to find the element before the script tag. (if you need specifics here, see Chris Kooken's answer).


if you use jquery you get .next() .previous() .parent() and .children() for traversing the DOM.


You can pass an object as a parameter to your jquery function, if that helps...
(...better example)
Assuming "rodd" is a jquery object that you've selected...

function Callme(rodd) {
  if (rodd.is(":checked")) {
    // ...
  }
}


There's a way

   function prevElement(name) {
    var script = document.getElementsByTagName('script');
    var me = script[script.length-1];
    name = name.toLowerCase();
    return (function(obj) {
        if(!obj) return null;
        var n = obj.nodeName.toLowerCase();
        if(n == name) return obj;
        if(n == 'body') return null;
        if(obj.previousSibling) return arguments.callee(obj.previousSibling, name);
        return null;
    })(me.previousSibling);
 }
  var span = prevElement('span');
  alert(span);


I'm not really sure if this is what you're trying to do, but why not call the function on an event from the element itself?

ie

function func(data){
    //code here
}

<select onchange="func(this.value);">
    <option value="Hello">Hello</option>
    <option value="World">World</option>
</select>

That way you can instantly pass the values.

0

精彩评论

暂无评论...
验证码 换一张
取 消