Fatal编程技术网
  • javascript/
  • Javascript 使用Jquery替换名称属性的特定部分？

Javascript 使用Jquery替换名称属性的特定部分？

javascript jquery

Javascript 使用Jquery替换名称属性的特定部分？,javascript,jquery,Javascript,Jquery,当我按下页面上的提交按钮时，我想用递增的整数值替换一些文本 <input type="text" id="peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]" name="peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]" required="required" placeh

当我按下页面上的提交按钮时，我想用递增的整数值替换一些文本

<input type="text" id="peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]" name="peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]" required="required" placeholder="Max" highlight_from="min" hover_error="1" rel="slider" min="0" max="1000" step="100" prefix="" suffix="" divisor="1" class="form-control" value="500">
我希望被一个增量元素替换，该增量元素在页面上找到的该名称属性的每次迭代中都添加1。

有两种方法可以做到这一点，您可以使用
localstorage
，也可以使用
sessionStorage

localStorage
和
sessionStorage
都扩展了存储。除了预期的
会话存储
的“非持久性”之外，它们之间没有区别

也就是说，存储在
localStorage
中的数据会一直存在，直到显式删除为止。所做的更改将被保存，并可用于所有当前和将来的站点访问

对于
sessionStorage
，更改仅在每个窗口（或在Chrome和Firefox等浏览器中的选项卡）可用。所做的更改将保存并可用于当前页面，以及在同一窗口上对站点的未来访问。窗口关闭后，存储将被删除

因此，在我的代码下面，它显示在按钮点击上，检查
localstorage
，如果没有
localstorage
，则用
[submission=“+counter+”]
替换
[replace\u THIS\u on\u PERSIST]
，并创建
localstorage

本地存储：
localStorage.setItem（“提交”，计数器）

然后在第二个按钮上单击，它将检查本地存储，然后在每次单击时继续添加计数器

示例：


var counter = 0;

if (localStorage.submission) 
{      
    counter = localStorage.submission;
    if ($("input[id*='[REPLACE_THIS_ON_PERSIST]']"))
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            var select = $(this);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + localStorage.submission + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
}

$("#buttonTest").on('click', function () 
{
    if (localStorage.submission) 
    {                         
        $("input[id*='submission=" + localStorage.submission + "']").each(function()
        {
            var select = $(this);
            counter++;
            localStorage.setItem("submission", counter);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + localStorage.submission + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        });
    }
    else
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            counter++;
            var select = $(this);
            // Store
            localStorage.setItem("submission", counter);

            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + counter + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
});



var counter = 0;

if (sessionStorage.getItem("submission")) 
{      
    counter = sessionStorage.getItem("submission");
    if ($("input[id*='[REPLACE_THIS_ON_PERSIST]'], input[name*='[REPLACE_THIS_ON_PERSIST]']"))
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]'], input[name*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            var select = $(this);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
}

$("#buttonTest").on('click', function () 
{
    if (sessionStorage.getItem('submission')) 
    {                         
        $("input[id*='submission=" + sessionStorage.getItem('submission') + "']").each(function()
        {
            var select = $(this);
            counter++;
            sessionStorage.setItem("submission", counter);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        });
    }
    else
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]'], input[name*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            counter++;
            var select = $(this);
            // Store
            sessionStorage.setItem("submission", counter);

            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + counter + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][submission=" + counter + "][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
});



id='peerSubscription[PeerReventSubscriptions][submission=1][maxThreshold]'


id='peerSubscription[PeerReventSubscriptions][submission=2][maxThreshold]'


id='peerSubscription[PeerReventSubscriptions][submission=3][maxThreshold]'



代码（仅通过ID属性显示）：


var counter = 0;

if (localStorage.submission) 
{      
    counter = localStorage.submission;
    if ($("input[id*='[REPLACE_THIS_ON_PERSIST]']"))
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            var select = $(this);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + localStorage.submission + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
}

$("#buttonTest").on('click', function () 
{
    if (localStorage.submission) 
    {                         
        $("input[id*='submission=" + localStorage.submission + "']").each(function()
        {
            var select = $(this);
            counter++;
            localStorage.setItem("submission", counter);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + localStorage.submission + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        });
    }
    else
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            counter++;
            var select = $(this);
            // Store
            localStorage.setItem("submission", counter);

            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + counter + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
});



var counter = 0;

if (sessionStorage.getItem("submission")) 
{      
    counter = sessionStorage.getItem("submission");
    if ($("input[id*='[REPLACE_THIS_ON_PERSIST]'], input[name*='[REPLACE_THIS_ON_PERSIST]']"))
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]'], input[name*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            var select = $(this);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
}

$("#buttonTest").on('click', function () 
{
    if (sessionStorage.getItem('submission')) 
    {                         
        $("input[id*='submission=" + sessionStorage.getItem('submission') + "']").each(function()
        {
            var select = $(this);
            counter++;
            sessionStorage.setItem("submission", counter);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        });
    }
    else
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]'], input[name*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            counter++;
            var select = $(this);
            // Store
            sessionStorage.setItem("submission", counter);

            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + counter + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][submission=" + counter + "][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
});



var计数器=0；
if（localStorage.submission）
{      
计数器=localStorage.submission；
if（$（$（输入[id*='[替换此项]']））
{
$（“输入[id*='[REPLACE_THIS_ON_PERSIST]']”）。每个（函数（）
{
var select=$（此值）；
选择。替换为（“”）；
}); 
}
}
$（“#按钮测试”）。在（'click'，函数（）
{
if（localStorage.submission）
{                         
$（“输入[id*='submission=“+localStorage.submission+“']”）。每个（函数（）
{
var select=$（此值）；
计数器++；
setItem（“提交”，计数器）；
选择。替换为（“”）；
});
}
其他的
{
$（“输入[id*='[REPLACE_THIS_ON_PERSIST]']”）。每个（函数（）
{
计数器++；
var select=$（此值）；
//贮藏
setItem（“提交”，计数器）；
选择。替换为（“”）；
}); 
}
});




示例：



代码：


var counter = 0;

if (localStorage.submission) 
{      
    counter = localStorage.submission;
    if ($("input[id*='[REPLACE_THIS_ON_PERSIST]']"))
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            var select = $(this);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + localStorage.submission + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
}

$("#buttonTest").on('click', function () 
{
    if (localStorage.submission) 
    {                         
        $("input[id*='submission=" + localStorage.submission + "']").each(function()
        {
            var select = $(this);
            counter++;
            localStorage.setItem("submission", counter);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + localStorage.submission + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        });
    }
    else
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            counter++;
            var select = $(this);
            // Store
            localStorage.setItem("submission", counter);

            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + counter + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][REPLACE_THIS_ON_PERSIST][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
});



var counter = 0;

if (sessionStorage.getItem("submission")) 
{      
    counter = sessionStorage.getItem("submission");
    if ($("input[id*='[REPLACE_THIS_ON_PERSIST]'], input[name*='[REPLACE_THIS_ON_PERSIST]']"))
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]'], input[name*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            var select = $(this);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
}

$("#buttonTest").on('click', function () 
{
    if (sessionStorage.getItem('submission')) 
    {                         
        $("input[id*='submission=" + sessionStorage.getItem('submission') + "']").each(function()
        {
            var select = $(this);
            counter++;
            sessionStorage.setItem("submission", counter);
            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][submission=" + sessionStorage.getItem('submission') + "][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        });
    }
    else
    {
        $("input[id*='[REPLACE_THIS_ON_PERSIST]'], input[name*='[REPLACE_THIS_ON_PERSIST]']").each(function()
        {
            counter++;
            var select = $(this);
            // Store
            sessionStorage.setItem("submission", counter);

            select.replaceWith("<input type='text' id='peerSubscription[peerEventSubscriptions][submission=" + counter + "][maxThreshold]' name='peerSubscription[peerEventSubscriptions][submission=" + counter + "][maxThreshold]' required='required' placeholder='Max' highlight_from='min' hover_error='1' rel='slider' min='0' max='1000' step='100' prefix='' suffix='' divisor='1' class='form-control' value='500'>");
        }); 
    }
});



var计数器=0；
if（sessionStorage.getItem（“提交”））
{      
计数器=sessionStorage.getItem（“提交”）；
如果（$（$（输入[id*='[REPLACE\u THIS\u ON\u PERSIST]]]，输入[name*='[REPLACE\u THIS\u ON\u PERSIST]]]））
{
$（“输入[id*=”[REPLACE_THIS_ON_PERSIST]]，输入[name*=”[REPLACE_THIS_ON_PERSIST]]]）。每个（函数（）
{
var select=$（此值）；
选择。替换为（“”）；
}); 
}
}
$（“#按钮测试”）。在（'click'，函数（）
{
if（sessionStorage.getItem（'submission'））
{                         
$（“输入[id*='submission=“+sessionStorage.getItem（'submission'）+”]）。每个（函数（）
{
var select=$（此值）；
计数器++；
sessionStorage.setItem（“提交”，计数器）；
选择。替换为（“”）；
});
}
其他的
{
$（“输入[id*=”[REPLACE_THIS_ON_PERSIST]]，输入[name*=”[REPLACE_THIS_ON_PERSIST]]]）。每个（函数（）
{
计数器++；
var select=$（此值）；
//贮藏
sessionStorage.setItem（“提交”，计数器）；
选择。替换为（“”）；
}); 
}
});

您的站点是否在提交时刷新？是，页面在提交时刷新。我只需要为了提交而更改这些值。您还需要提交这些值，并在加载时更改ID。如果每个用户的ID都需要永久增加，则必须提交。如果每个用户的ID都需要永久增加，则必须提交。如果此ID可能不稳定，您应该查看
localStorage
和
sessionStorage
。它们可能对您的需要很有用。@Ryan如果您查看我更新的答案，它应该会提供您所需的。@sailens它可以工作，因为他可能每次都在刷新页面。因此，该值将重置为
[在保存时替换此]
，并且他将在每次提交之前不断更改
ID
。（我知道这不是最好的做法，但这是一种方法）或者就像你在上面对他的问题的评论中所说的那样，他需要在每次提交时提交新ID，然后在页面刷新时加载。他可以始终使用
localStorage
或
sessionStorage
来避免提交。我们对它的用途知之甚少ID@sailens是的，你说得对。我已经更新了我的答案，以显示我们正在讨论的内容。您是否也可以向op推荐会话存储。因为本地存储在浏览器上持续存在close@Jesse我已经更新了答案，提供了有关
localstorage
和
sessionStorage