Question

我有以下代码获取URL参数，从select元素中选择一个选项，然后隐藏select所在的div。

它将出现在由第三方服务提供的表单上，我只能访问表单头部的js文件，还有很多其他的javascript。 jQuery无法使用（它不在脑海中）。

我不确定的是如何在页面的其余部分加载之后运行代码（或者至少需要的元素），我不能使用window.onload，我想尽可能多地包装尽可能避免在其他地方使用相同名称的变量。

感谢。

function getURLparameter( variable ){
variable = variable.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+variable+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( window.location.href );
if( results == null )
    return "";
else
    return results[1];
}
var typeNum = {
    abc: {
        redirectURL: 'http://www.1.com',
        optionIndex: 1
    }, 
    123: {
        redirectURL: 'http://www.2.com',
        optionIndex: 2
    },
    //etc etc
};

var formId = getURLparameter('SurveyID');


if (formId === 384) {
    var urlType = getURLparameter('type');
    var theType = typeNum[urlType];
    var selectDiv = ('the_div');
    var selectField = ('the_select');
    if (urlType in typeNum) {
        document.getElementById(selectField).options[theType.optionIndex].selected = true;
        document.getElementById(selectDiv).style.visibility = "hidden";
    }
}

Answer 1

~~您需要将它放在页面底部，在脚本中访问的所有元素下面。~~

如果要包装它，请使用self-executing anonymous function：

(function() {
  // all your code should be moved here
})();

这样，内部定义的变量和函数都不会在外部访问。

更新（见评论）：

如果其他脚本使用了window.onload，您仍然可以在其中添加自己的代码：

// previous onload function - defined in another script for example
window.onload = function() {
  document.getElementById("test").innerHTML = "hello";
};

// we will add another function to onload
window.onload = (function() {
  // previous onload function
  var oldonload = window.onload;

  // return new onload function ...
  return function() {
    // .. that will call previous onload
    oldonload();
    // and add something extra
    document.getElementById("test").innerHTML += " world!";
  };
})();

HERE 是代码。

编辑：

symcbean 的评论：

或者不是使用闭包，只需使用window.addEventListener（）http://developer.mozilla.org/en/Code_snippets/On_page_load

对于IE版本＆lt;必须使用9 attachEvent()。请参阅this。

Answer 2

// wrap it all in an anonymous function
(function (callback) {
  if (document.readyState === "complete") {
    // if the document already has finished loading, execute immediately
    callback();
  } else {
    // if it hasn't finished yet, attach the callback to the load event
    if ( document.addEventListener ) {  /* Opera, Firefox, Webkit */
      window.addEventListener("load", callback, false);
    } else if ( document.attachEvent ) {  /* IE */
      window.attachEvent("onload", callback);
    }
  }
})(
  // immediately call that anonymous function, passing your callback 
  function () { 
    // this will be executed when the DOM is ready, 
    // so put all your stuff here
  }
);

Answer 3

每100ms设置一个间隔，以检查您的元素是否准备就绪......

(function() {
    var myInterval = setInterval( function () {
        if( var myElement = document.getElementById('idOfYourElement') ) {
            clearInterval( myInterval );
            // do what you want to do with myElement.
        }
    }, 100 );
})();

在头部运行javascript，无法使用window.onload，无法使用jquery

3 个答案:

更新（见评论）：

编辑：