如何在javascript中正确地获得这些DOM元素名称？_Javascript_Jquery

如何在javascript中正确地获得这些DOM元素名称？

javascript jquery

如何在javascript中正确地获得这些DOM元素名称？,javascript,jquery,Javascript,Jquery,我需要创建一个网页，其中有许多重复的形式，将更新页面上的一些div。想象一下，有一个长长的图书列表，标签为“Book 1”、“Book 2”，等等，您必须单击链接才能看到任何给定图书的名称。将有数百人。我想用一个脚本来完成它。我想我已经解决了所有问题，但我不清楚如何调用其中两个DOM元素。注意，我正在使用jQuery（出于与此问题无关的原因，请相信我必须使用它）。以下是我需要帮助的代码和注释： <html> <head> <script language

我需要创建一个网页，其中有许多重复的形式，将更新页面上的一些div。想象一下，有一个长长的图书列表，标签为“Book 1”、“Book 2”，等等，您必须单击链接才能看到任何给定图书的名称。将有数百人。我想用一个脚本来完成它。我想我已经解决了所有问题，但我不清楚如何调用其中两个DOM元素。注意，我正在使用jQuery（出于与此问题无关的原因，请相信我必须使用它）。以下是我需要帮助的代码和注释：

<html>
  <head>
    <script language="javascript" type="text/javascript"
      src="/wp-includes/js/jquery/jquery.js"></script>
  </head>

  <body>
    <p>Book 1</p>
    <form id="form001">
      <input type="hidden" name="book" value="Stranger In A Strange Land" />
      <input type="submit" name="submit" value="submit" />
    </form>
    <div id="output001"></div>

    <p>Book 2</p>
    <form id="form002">
      <input type="hidden" name="book" value="I, Robot" />
      <input type="submit" name="submit" value="submit" />
    </form>
    <div id="output002"></div>

    <script id="source" language="javascript" type="text/javascript">
      var $j = jQuery.noConflict();
      $j( "form" ).submit(function ( )
      {


        var book = ???;        //  <========= What do I put here???
        var formName = ???;    //  <========= What do I put here???


        // Below I extract the form number (e.g. “001” from “form001”) and
        // tack it on to the div name I am repopulating
        var outputDiv = '#output' + substr( formName, formName.length - 3, 3 ); 

        $j(outputDiv).html(book);
      }); 
    </script>

  </body>
</html>


第一册
第二册
var$j=jQuery.noConflict（）；
$j（“表格”）。提交（功能（）
{
var book=？？？；//我建议：
  var $j = jQuery.noConflict();

  $j( "form" ).submit(function (event) {
    // event is the form-submission event, which we
    // (probably) want to cancel, which we do by calling:
    event.preventDefault();

    // 'this' is the current <form> that's being submitted,
    // we look within that <form> to find the <input> element
    // with a name equal to 'book', and retrieve its value:
    var book = $j(this).find('input[name=book]').val();

    // we get the id of the <form> here:
    var formName = this.id;

    // here we select the appropriate element by replacing
    // the 'form' with 'output', and constructing an id-selector:
    $j('#' + formName.replace('form', 'output')).html(book);
  });

var$j=jQuery.noConflict（）；
$j（“表格”）。提交（功能（事件）{
//事件是表单提交事件，我们
//（可能）要取消，请拨打以下电话：
event.preventDefault（）；
//“这”是正在提交的当前文件，
//我们从中寻找元素
//名称等于“book”，并检索其值：
var book=$j（this.find（'input[name=book]'）.val（）；
//我们可以在这里获得的id：
var formName=this.id；
//在这里，我们通过替换来选择适当的元素
//带有“output”的“form”，并构造一个id选择器：
$j（“#”+formName.replace（'form'，'output'））.html（book）；
});

参考资料：

JavaScript:




jQuery：





似乎您的问题设计得太复杂了。每当我看到这样提交多个表单时，我总是想知道我是否能找到一个更优雅、更简单的解决方案。只是为了确保，您希望将书名（例如，异乡的陌生人
）以适当的ID输出到输出div（例如div#output001
）？