如何操作字符串從輸入值在Javascript上

Question

我有一個輸入元素<input id="mystring" type="text"></input>。

的id將是這樣的：

mystring = "myid,myid01" 

當我打開一個網頁我想一個頁面添加值mystring象下面這樣：

mystring = "myid,myid01,page1" 

如果我去第二頁，第三頁則回到Page1。 mystring的值如下所示。假設沒有添加第1頁兩次：

mystring = "myname,myid,page1,page2,page3" 

我也想刪除mystring值就像我刪除第二頁。隨後的mystring值將是：

mystring = "myname,myid,page1,page3" 

我想這個劇本，但它沒有工作：

function changestringvalue() { 
    var filters = $("#mystring").val(); 
    var newFilter = 'test,'; 
    if (-1 !== (idx = jQuery.inArray(newFilter, filters))) { 
     // remove 
     filters.splice(idx, 1); 
    } 
    else { 
     // add 
     filters.push(newFilter); 
    } 
    alert($("#mystring").val()); 
} 

Answer 1

你可以試試下面的代碼。適應您的特定需求。這是純JavaScript，沒有jQuery的

function changestringvalue(add) { 
 
    var input = document.getElementById('mystring'); 
 
    var inputVal = input.value; 
 
    var span = document.getElementById('myspan'); 
 
    var spanVal = span.innerHTML; 
 

 
    if (add) { 
 
    if (spanVal.indexOf(inputVal) === -1) { 
 
     if (span.innerHTML == "") { 
 
     span.innerHTML = inputVal; 
 
     } else { 
 
     span.innerHTML = span.innerHTML + ", " + inputVal 
 
     } 
 
     //console.log('Added \'' + inputVal + '\''); 
 
    } else { 
 
     console.log('Previously added - canceled!'); 
 
    } 
 
    } 
 
    else { 
 
    if (spanVal.indexOf(", " + inputVal) !== -1) { 
 
     span.innerHTML = spanVal.replace(", " + inputVal, ""); 
 
     //console.log('Removed \'' + inputVal + '\''); 
 
    } 
 
    else if (spanVal.indexOf(inputVal + ", ") !== -1) { 
 
     span.innerHTML = spanVal.replace(inputVal + ", ", ""); 
 
     //console.log('Removed \'' + inputVal + '\''); 
 
    } 
 
    else if (spanVal == inputVal) { 
 
     span.innerHTML = spanVal.replace(inputVal, ""); 
 
     //console.log('Removed \'' + inputVal + '\''); 
 
    } 
 
    else { 
 
     console.log('<String not found>'); 
 
    } 
 
    } 
 
}

<input id="mystring" type="text" value="mystring"></input> 
 
<br/> 
 
<button onclick="changestringvalue(true)">Add</button> 
 
<br/> 
 
<button onclick="changestringvalue()">Remove</button> 
 
<br/> 
 
<br/> 
 
<span id="myspan">mystring</span>