Javascript jquery-动态生成url_Javascript_Jquery_Keyup

Javascript jquery-动态生成url

javascript jquery

Javascript jquery-动态生成url,javascript,jquery,keyup,Javascript,Jquery,Keyup,我试图在用户输入内容时动态创建url段塞。应删除不需要的字符。空格应替换为连字符，所有内容都应使用小写。因此，如果用户键入“Ruddy's Cheese Shop”，则应显示“Ruddy's Cheese Shop” 这就是我目前所拥有的 <input id="tb1" /> <div id="tb2"></div> $('#tb1').keyup(function() { var Text = $('#tb1').val(); Text = Tex

我试图在用户输入内容时动态创建url段塞。应删除不需要的字符。空格应替换为连字符，所有内容都应使用小写。因此，如果用户键入“Ruddy's Cheese Shop”，则应显示“Ruddy's Cheese Shop”

这就是我目前所拥有的

<input id="tb1" />
<div id="tb2"></div>

$('#tb1').keyup(function() {
  var Text = $('#tb1').val();
  Text = Text.toLowerCase();
  Text = Text.replace(/[^a-zA-Z0-9]+/g,'-');
  $('#tb2').html($('#tb1').val(Text));
});


$（'#tb1'）.keyup（函数（）{
var Text=$（'#tb1'）.val（）；
Text=Text.toLowerCase（）；
Text=Text.替换（/[^a-zA-Z0-9]+/g，'-'）；
$（'#tb2'）.html（$（'#tb1'）.val（文本））；
});

它几乎可以工作，但我是新的js。谢谢

除非您设置了#tb2值，否则它看起来没问题。我想你想要：

$('#tb2').html(Text);

当然，请记住，既然调用了toLowerCase，就不需要替换大写字符。更简单的regexp：

Text = Text.replace(/[^a-z0-9]+/g,'-');

如果还希望在用户键入时更新编辑字段，下面是一个完整的示例。请注意，它只会在您开始键入时更新#td2

  <html>
    <head>
      <script src="js/jquery.js" ></script>
      <script language="javascript">
      $(function() {
        $('#tb1').keyup(function() {
           var Text = $('#tb1').val();
           Text = Text.toLowerCase();
           Text = Text.replace(/[^a-z0-9]+/g,'-');
           $('#tb2').html(Text);
           $('#tb1').val(Text);
        });
      });
      </script>
    </head>
  <body>
  <input type="text" id="tb1" value="Ruddy's Cheese Shop" />
  <div id="tb2"></div>
  </body>
  </html>


$（函数（）{
$（'#tb1'）.keyup（函数（）{
var Text=$（'#tb1'）.val（）；
Text=Text.toLowerCase（）；
Text=Text。替换（/[^a-z0-9]+/g，“-”）；
$（'#tb2'）.html（文本）；
$（'#tb1'）.val（文本）；
});
});

您的代码有了一些改进

$('#tb1').keyup(function() {
    var text = $(this).val().toLowerCase();
    text = text.replace(/[^a-z0-9]+/g, '-');
    $('#tb2').text(text);
});

您不需要反复查找

$（'#tb1'）

元素，因为在函数中有一个对它的引用，即

$（this）

看起来您需要运行两个替换，即

Text = Text.replace(/[\s]+/g,'-'); 
Text = Text.replace(/[^a-z_0-9\-]+/g,'');

把ruddy的奶酪店变成了ruddy的奶酪店

希望这能有所帮助

“它几乎可以工作…”-你能更具体一点吗？