Question

我有以下脚本，但是我认为这可以简化，对吧？另外，我希望它只触发一次。

示例，用户输入“我的标题”。脚本执行，用户在slug字段中看到“my-title”。如果用户用“我的疯狂标题”替换标题值，我希望slug保持“my-title”。怎么样？

$('#article_title').change(function() {
  str = $('#article_title').val();
  formatted = str.replace(/\s+/g, '-').toLowerCase();
  $('#article_slug').val(formatted);
});

请参阅代码示例http://jsfiddle.net/TSrYu/

Answer 1

var changed = false;
$('#article_title').change(function () {
    // do some other stuff
    if (!changed) {
        str = $(this).val();
        formatted = str.replace(/\s+/g, '-').toLowerCase();
        $('#article_slug').val(formatted);
    }
    changed = true;
});

http://jsfiddle.net/mohammadAdil/TSrYu/1/

Answer 2

您可以这样简化：

切换到使用.one()注册您的事件处理程序，以便只触发一次。
删除中间变量，只需一次处理字符串

代码：

$('#article_title').one('change', function() {
    $('#article_slug').val($(this).val().replace(/\s+/g, '-').toLowerCase());
});

工作演示：http://jsfiddle.net/jfriend00/XGjWA/

Answer 3

您可以进行两项小改进：

通过正确声明变量，不使变量成为全局变量。
不再为该元素查询DOM，因为访问this

要确保它只发生一次，您可以取消绑定事件（片段中的最后一行

$('#article_title').change(function() {
  var str = $(this).val();
  var formatted = str.replace(/\s+/g, '-').toLowerCase();
  $('#article_slug').val(formatted);
  $(this).unbind("change");
});

Javascript条件执行和简化

3 个答案: