javascript - 同一元素块一次可见并进行变量命名

我有一些移动版和台式机版代码。 FORM中的所有元素都是相同的，但是一次可见的代码块取决于屏幕大小（一个始终设置为display: none），

<div id="desktop">
  <div id="content">
    <form method="post" name="form_name" id="id_form">
      <input type="email" name="name_email" id="id_email">
      <input type="hidden" name="hidden_input" value="submit_sub">
      <a href="#" id="btnSub">SAVE</a>
    </form>
  </div>
</div>


<div id="mobile">
  <div id="content">
    <form method="post" name="form_name" id="id_form">
      <input type="email" name="name_email" id="id_email">
      <input type="hidden" name="hidden_input" value="submit_sub">
      <a href="#" id="btnSub">SAVE</a>
    </form>
  </div>
</div>

//some JQ code
    $("#btnSub").click(function(e) {
        e.preventDefault();
        if ($("#id_email").val() == "") {}
    });

//some PHP code
  if (isset($_POST["hidden_input"]) == "submit_sub") {}

上面的代码在台式机和移动设备上看起来都是相同的，但实际上，所有元素在移动设备和台式机中的设置都不同。我的问题是：我可以对ID，NAME使用相同的命名，还是即使一次可见也应该分开命名？如果不需要，我是否需要像其他ID一样随处更改或更改类，可以在哪里保留相同的名称？最好的方法是使用正确的名称重写上面的示例。

我写这个问题的原因是，我已经写了一些代码，无法正确运行它，我不知道我是否应该更改所有内容，或者是否应该更改一些内容。所以，我想知道主要规则。

最佳答案

由于它们的格式不同，因此可以使用相同的名称发送数据，但是如果您在JS代码中需要使用相同的名称，则不要使用相同的名称，请尝试使用类。

ID对于页面是唯一的，请使用类。

:)