麻烦的javascript

我正在尝试制作一个小标签列表，用于添加和删除标签。我有一个文本框，用户可以在其中输入标记，用逗号分隔。和一个添加按钮。我想当用户点击add按钮将一个小div添加到方框下方的div内部时使用它。小div应该包含标记和一个小x，以便稍后删除标记。以下是我所拥有的：

<script type='text/javascript'>
  function tagsremove(tag) {
    document.getElementByName('tags').value.replace('/'+tag+'\,\s/', '');
  }

  $('#tagbutton').click(function(){
    var tags = $('#tagsbox').text().split(", ");
    for (var tag in tags) {
      document.getElementByName('tags').value += tag +", ";
      $('#curtags').append("<div class='tag'>" 
        + tag 
        + " <a href='#' onlclick='tagsremove(\'" 
        + tag 
        + "\');$(this).hide();'>x</a></div>")
    }
  });
</script>

<div class='statbox'>
  <form method='post' action='post.php' id='writeform'>
    <p class='subtitle'>Title</p>
    <input type='text' name='title' id='titlebox' /><br />
    <p class='subtitle'>Body</p>
    <textarea id='postbox' name='body' rows='10'></textarea><br />
    <p class='subtitle'>Tags</p>
    <input type='text' id='tagsbox' /><input type='button' id='tagbutton' 
      value='Add' />
    <p class='subsubtitle'>Seperate by commas 
      (eg. "programming, work, job")</p>
    <div class='subsubtitle' id='curtags'>Current Tags:</div>
    <input type='hidden' value='' name='tags' />
  </form>
</div>

功能标签移动（标签）{
document.getElementByName（'tags'）.value.replace（'/'+tag+'\，\s/'，''）；
}
$（“#标记按钮”）。单击（函数（）{
var tags=$（'#tagsbox'）.text（）.split（“，”）；
for（标记中的变量标记）{
document.getElementByName（'tags'）。value+=tag+“，”；
$（'#curtags'）。追加（“”
+标签
+ " ")
}
});
标题


正文


标签
用逗号分隔
（例如“编程、工作、工作”）
当前标签：

---

我遇到的问题是，当我单击add按钮时，什么也没有发生。我想解决这个问题。

我不熟悉在单击按钮时使用此方法调用函数

$('#tagbutton').click(function(){

我通常只是把

onClick='function()'

在输入标记内部。并在脚本中将函数声明为正常

---

另外，我认为应该用一个空格来分隔标记。这是人们习惯的。但是如果您确实决定要能够使用多个单词标记，那么请使用“，”not“，”分隔。我不熟悉在单击按钮时使用此方法调用函数

$('#tagbutton').click(function(){

我通常只是把

onClick='function()'

在输入标记内部。并在脚本中将函数声明为正常

---

另外，我认为应该用一个空格来分隔标记。这是人们习惯的。但是，如果您确实决定要使用多个word标记，那么用“，”not“，”来分隔，

我猜是您的脚本块在加载dom之前正在执行，因此单击事件实际上没有注册到真实的元素。将单击事件放入文档中。准备好事件如下：

$(function() {
    $('#tagbutton').click(function(){
        //etc...
    });
});

for (var i in tags) {
    var tag = tags[i];
}

---

另外，（顺便提一下）为什么要将jQuery与常规javascript混合使用？将隐藏标记字段更改为具有标记id&do$（'#tags'）.val（…）而不是document.getElementByName（'tags'）。value=…

我猜在加载dom之前正在执行注册单击事件的脚本块，因此单击事件实际上没有注册到真实的元素。将单击事件放入文档中。准备好事件如下：

$(function() {
    $('#tagbutton').click(function(){
        //etc...
    });
});

for (var i in tags) {
    var tag = tags[i];
}

---

另外，（顺便提一下）为什么要将jQuery与常规javascript混合使用？将隐藏标记字段更改为具有标记id&do$（'#tags'）.val（…）而不是document.getElementByName（'tags'）。value=…

您的第一个问题是

$('#tagsbox').text()

应该是

$('#tagsbox').val()

因为#tagsbox是一个输入字段

---

还有其他一些问题，比如在“，”上拆分，然后修剪而不是在“，”上拆分，但我认为您的主要问题是.text（）与.val（）

您的第一个问题是

$('#tagsbox').text()

应该是

$('#tagsbox').val()

因为#tagsbox是一个输入字段

---

还有其他一些问题，比如在“，”上拆分，然后修剪而不是在“，”上拆分，但我认为您的主要问题是.text（）与.val（）

您的代码中存在一些问题：

1）document.getElementByName（'标记'）

如果这样的函数不存在，那么您尝试使用的函数是getElementsByName（请注意“s”），但是由于您使用的是jQuery，因此可以使用如下选择器：

 var hiddenTags = $('input[name=tags]');

2） 您使用的是text（），而不是val（）作为点

3） 在foreach中，您只能访问元素索引，要访问实际元素值，必须执行以下操作：

$(function() {
    $('#tagbutton').click(function(){
        //etc...
    });
});

for (var i in tags) {
    var tag = tags[i];
}

---

还有更多的工作要做，但对于开始，请检查我的更正。

您的代码中有一些问题：

1）document.getElementByName（'标记'）

如果这样的函数不存在，那么您尝试使用的函数是getElementsByName（请注意“s”），但是由于您使用的是jQuery，因此可以使用如下选择器：

 var hiddenTags = $('input[name=tags]');

2） 您使用的是text（），而不是val（）作为点

3） 在foreach中，您只能访问元素索引，要访问实际元素值，必须执行以下操作：

$(function() {
    $('#tagbutton').click(function(){
        //etc...
    });
});

for (var i in tags) {
    var tag = tags[i];
}

---

还有更多的工作要做，但是对于start，请检查我的更正。

首先，正如上面提到的，在页面上创建元素之前，您的onclick事件Javascript代码已经注册。因此，它不受约束。要解决这个问题，请使用jQuery提供的这个dom就绪函数包装代码

$(document).ready(function () {
    //put code here
});

将此行var tags=$（'#tagsbox'）.text（）.split（“，”）更改为

由于document.getElementByName不是JS函数，因此代码中还存在语法错误。可能会为其指定一个id或名称属性以使其成为目标

接下来，一旦将隐藏的标记拆分为一个数组，也许可以通过这种方式遍历它们来构建它们

$.each(tags, function(i, val) {
    $('#curtags').append("<div class='tag'>" 
    + val 
    + " <a href='#' onlclick='tagsremove(\'" 
    + tag 
    + "\');$(this).hide();'>x</a></div>")
});

$。每个（标记、函数（i、val）{
$（'#curtags'）。追加（“”
+瓦尔
+ " ")
});

首先，正如上面提到的，onclick事件的Javascript代码是在页面上创建元素之前注册的。因此，它不受约束。要解决这个问题，请使用jQuery提供的这个dom就绪函数包装代码

$(document).ready(function () {
    //put code here
});

将此行var tags=$（'#tagsbox'）.text（）.split（“，”）更改为

由于document.getElementByName不是JS函数，因此代码中还存在语法错误。可能会为其指定一个id或名称属性以使其成为目标

接下来，一旦将隐藏的标记拆分为一个数组，也许可以通过这种方式遍历它们来构建它们

$.each(tags, function(i, val) {
    $('#curtags').append("<div class='tag'>" 
    + val 
    + " <a href='#' onlclick='tagsremove(\'" 
    + tag 
    + "\');$(this).hide();'>x</a></div>")
});

$。每个（标记、函数（i、val）{
$（'#curtags'）。追加（“”
+瓦尔
+ " ")
});

看起来他在使用jQuery。Javascript不应该出现在您的HTML中。行为应该与标记分开。看起来他在使用jQuery