将这部分Javascript与另一部分结合起来?

时间:2013-02-01 08:30:50

标签: php javascript html forms

由于我在JS,JQuery和PHP的每个方面都是完整的n00b,我需要一些帮助。

对于具有JS基础知识的人来说,这可能很简单,但对我来说并不是那么简单。

我的index.php中有以下部分:

<form method="get" id="searchform" action="http://wwwapps.ups.com/WebTracking/track?HTMLVersion=5.0&loc=nl_NL&Requester=UPSHome&WBPM_lid=homepage%2Fct1.html_pnl_trk" target="_blank" >
<input type="text" value="" name="trackNums" id="ups" />
<input type="hidden" name="track.x" value="Traceren">
<input type="hidden" name="loc" value="nl_NL">
<input type="image" src="afbeeldingen/search_btn.png" id="searchsubmit" />
</form>

在.js文件中我有:

$(document).ready(function() {
    $("#ups").attr("value", "UPS Trackingscode...");
    var text = "UPS Trackingscode...";
    $("#ups").focus(function() {
        $(this).addClass("active");
        if($(this).attr("value") == text) $(this).attr("value", "");
    });
    $("#ups").blur(function() {
        $(this).removeClass("active");
        if($(this).attr("value") == "") $(this).attr("value", text);
    });
});

我在.js文件中添加了这个(在顶部):

function removeSpaces(string) {
    return string.split(' ').join('');
}

但是当我将这个部分添加到index.php(form-section)时,它不起作用:

<input type="text" onblur="this.value=removeSpaces(this.value);">

我想我必须将它合并到当前的JS中,但我不知道如何做到这一点或改变/添加什么。

我想在这里实现的是,每当我将跟踪代码粘贴到文本字段时,它应该会自动删除空格(如果有的话,因为执行了错误的复制/粘贴操作)。

这不适用于任何特殊网站,只是供我个人使用,因此我可以从我自己的首页更轻松地跟踪包裹。

我希望我能正确解释。对于拥有基本JS技能的人来说,可能需要不到一分钟的时间,但对我而言,这是非常困难的。 :(

1 个答案:

答案 0 :(得分:2)

该功能本身运作良好。这只是一个范围问题。您有两种选择:

1)您将功能移到$(document).ready(function() { })部分

之外

2)从元素中删除onblur="this.value=removeSpaces(this.value);",丢弃函数并编写相应的事件处理程序

// identifier or class needed to target the element, i use id="target"
$("#target").on("focusout",function(){
   this.value = this.value.replace(/\s*/g,"");
});

第二种方式(使用事件处理程序)被认为是更清洁和更好的方式。但两者都有效。

图片的标题说明:

要从字符串中删除空格,最好将replace方法与正则表达式/\s*/g一起使用(在整个字符串中替换零个或多个空格\s*(全局{{ 1}}))。

而不是g使用$(this).val()