Создать уникальный идентификатор с помощью javascript

Ответ 1

Не могли бы вы просто сохранить текущий индекс?

var _selectIndex = 0;

...code...
var newSelectBox = document.createElement("select");
newSelectBox.setAttribute("id","select-"+_selectIndex++);

ИЗМЕНИТЬ

При дальнейшем рассмотрении вы можете предпочесть использовать имена стиля массива для своих избранных...

например.

<select name="city[]"><option ..../></select>
<select name="city[]"><option ..../></select>
<select name="city[]"><option ..../></select>

то на стороне сервера в php, например:

$cities = $_POST['city']; //array of option values from selects

EDIT 2 В ответ на комментарий OP

Динамическое создание параметров с использованием методов DOM может быть выполнено следующим образом:

var newSelectBox = document.createElement("select");
newSelectBox.setAttribute("id","select-"+_selectIndex++);

var city = null,city_opt=null;
for (var i=0, len=cities.length; i< len; i++) {
    city = cities[i];
    var city_opt = document.createElement("option");
    city_opt.setAttribute("value",city);
    city_opt.appendChild(document.createTextNode(city));
    newSelectBox.appendChild(city_opt);
}
document.getElementById("example_element").appendChild(newSelectBox);

предполагая, что массив cities уже существует

В качестве альтернативы вы можете использовать метод innerHTML.....

var newSelectBox = document.createElement("select");
newSelectBox.setAttribute("id","select-"+_selectIndex++);
document.getElementById("example_element").appendChild(newSelectBox);

var city = null,htmlStr="";
for (var i=0, len=cities.length; i< len; i++) {
    city = cities[i];
    htmlStr += "<option value='" + city + "'>" + city + "</option>";
}
newSelectBox.innerHTML = htmlStr;

Ответ 2

другим способом использовать миллисекундный таймер:

var uniq = 'id' + (new Date()).getTime();

Ответ 3

var id = "id" + Math.random().toString(16).slice(2)

Ответ 4

function uniqueid(){
    // always start with a letter (for DOM friendlyness)
    var idstr=String.fromCharCode(Math.floor((Math.random()*25)+65));
    do {                
        // between numbers and characters (48 is 0 and 90 is Z (42-48 = 90)
        var ascicode=Math.floor((Math.random()*42)+48);
        if (ascicode<58 || ascicode>64){
            // exclude all chars between : (58) and @ (64)
            idstr+=String.fromCharCode(ascicode);    
        }                
    } while (idstr.length<32);

    return (idstr);
}

Ответ 5

Очень короткая функция даст вам уникальный идентификатор:

var uid = (function(){var id=0;return function(){if(arguments[0]===0)id=0;return id++;}})();

alert (uid());

Ответ 6

В ответ на @scott: Когда-то JS идет очень быстро... так что...

var uniqueId = null,
    getUniqueName = function(prefix) {
        if (!uniqueId) uniqueId = (new Date()).getTime();
        return (prefix || 'id') + (uniqueId++);
    };

Ответ 7

введите в ваше пространство имен экземпляр, похожий на следующий

var myns = {/*.....*/};
myns.uid = new function () {
    var u = 0;
    this.toString = function () {
        return 'myID_' + u++;
    };
};
console.dir([myns.uid, myns.uid, myns.uid]);

Ответ 8

Я работаю над аналогичной проблемой с OP и обнаружил, что элементы решений из @Guy и @Scott можно объединить, чтобы создать решение, которое будет более твердым IMO. Полученный уникальный идентификатор здесь имеет три раздела, разделенные символами подчеркивания:

• Ведущая буква;
• Временная метка, отображаемая в базе 36;
• И последний, случайный раздел.

Это решение должно работать очень хорошо, даже для очень больших наборов:

function uniqueId () {
    // desired length of Id
    var idStrLen = 32;
    // always start with a letter -- base 36 makes for a nice shortcut
    var idStr = (Math.floor((Math.random() * 25)) + 10).toString(36) + "_";
    // add a timestamp in milliseconds (base 36 again) as the base
    idStr += (new Date()).getTime().toString(36) + "_";
    // similar to above, complete the Id using random, alphanumeric characters
    do {
        idStr += (Math.floor((Math.random() * 35))).toString(36);
    } while (idStr.length < idStrLen);

    return (idStr);
}

Ответ 9

Чтобы избежать создания каких-либо счетчиков и быть уверенным, что идентификатор уникален, даже если есть некоторые другие компоненты, которые создают элементы с идентификаторами на странице, вы можете использовать случайное число и исправить его, если оно не достаточно хорошо (но вы также необходимо немедленно установить идентификатор, чтобы избежать конфликтов):

var id = "item"+(new Date()).getMilliseconds()+Math.floor(Math.random()*1000);
 // or use any random number generator
 // whatever prefix can be used instead of "item"
while(document.getElementById(id))
    id += 1;
//# set id right here so that no element can get that id between the check and setting it

Ответ 10

Как и другие пользователи, вы можете использовать запущенный индекс, или если вам не нравится идея использования переменной, просто потяните идентификатор последнего города в списке и добавьте 1 к его идентификатору.

Ответ 11

Вот функция (функция genID() ниже), которая рекурсивно проверяет DOM на уникальность, основанную на любом запрошенном id prefex/ID.

В вашем случае вы могли бы использовать его как таковой

var seedNum = 1;
newSelectBox.setAttribute("id",genID('state-',seedNum));

function genID(myKey, seedNum){
     var key = myKey + seedNum;
     if (document.getElementById(key) != null){
         return genID(myKey, ++seedNum);
     }
     else{
         return key;
     }
 }

Ответ 12

Здесь мой собственный подход к нему основан на xpath созданного элемента:

/** Returns the XPATH of an element **/
var getPathTo = function(element) {
  if (element===document.body)
      return element.tagName;

  var ix= 0;
  var siblings= element.parentNode.childNodes;
  for (var i= 0; i<siblings.length; i++) {
      var sibling= siblings[i];
      if (sibling===element)
          // stripped xpath (parent xpath + tagname + index)
          return getPathTo(element.parentNode)+ element.tagName + ix+1;
      if (sibling.nodeType===1 && sibling.tagName===element.tagName)
          ix++;
   }
}

/** hashcode function (credit http://stackoverflow.com/questions/7616461/generate-a-hash-from-string-in-javascript-jquery **/
var hashCode = function(str) {
  var hash = 0, i, chr, len;
  if (str.length === 0) return hash;
  for (i = 0, len = str.length; i < len; i++) {
    chr   = str.charCodeAt(i);
    hash  = ((hash << 5) - hash) + chr;
    hash |= 0; // Convert to 32bit integer
 }
return hash;
};

/** Genaretes according to xpath + timestamp **/
var generateUID = function(ele)
{
  return hashCode(getPathTo(ele)) + new Date().getTime();
}

Сначала выбирается xpath элемента.

Затем вычисляется хэш-код xpath. Поэтому у нас есть уникальный идентификатор на xpath.

Проблема здесь в том, что xpath не обязательно уникальны, если уникальные элементы генерируются "на лету". Таким образом, мы добавляем отметку времени в конце.

Возможно, мы могли бы также гарантировать более уникальные элементы, добавив окончательный Math.Random().

Ответ 13

Вы можете воспользоваться closure.

var i = 0;
function generateId() {
    return i++;
}

Если вы хотите заключить его:

function generator() {
  var i = 0;
  return function() {
    return i++;
  };
}

var generateId = generator();
generateId(); //1
generateId(); //2

generator может принимать префикс по умолчанию; generateId coud принимает необязательный суффикс:

function generator(prefix) {
  var i = 0;
  return function(suffix) {
    return prefix + (i++) + (suffix || '');
  };
}

var generateId = generator('_');
generateId('_'); //_1_
generateId('@'); //[email protected]

Это пригодится, если вы хотите, чтобы ваш идентификатор указывал последовательность, очень похожую на new Date().getTime(), но легче читать.

Ответ 14

Вы можете сгенерировать идентификатор, используя таймер и избегая дубликатов, используя performance.now():

id = 'id' + performance.now()
dup = 'id' + performance.now()

console.log(id)
console.log(id.replace('.','')) // sexy id
console.log(id === dup) // false!

.as-console-wrapper{border-top: none !important;overflow-y: auto !important;top: 0;}

Ответ 15

Я использую следующую функцию:

function (baseId) {
  return baseId + '-' + Math.random().toString(16).slice(2);
}

В параметре baseId я указываю, что префикс для идентификатора легче идентифицировать элементы.

Ответ 16

Предупреждение:. Этот ответ может быть не лучшим для общего намерения этого вопроса, но я размещаю его здесь, тем не менее, потому что он разрешает частичную версию этой проблемы.

Вы можете использовать lodash uniqueId (документация здесь). Это не хороший уникальный уникальный генератор, скажем, записи db или вещи, которые будут сохраняться в браузере или что-то в этом роде. Но причина, по которой я пришел сюда, искала это, была решена, используя ее. Если вам нужен уникальный идентификатор для чего-то достаточно преходящего, это будет делать.

Мне это нужно, потому что я создавал повторно используемый компонент реакции, в котором есть метка и элемент управления формой. Метка должна иметь атрибут for="controlId", соответствующий id="controlId", который имеет фактическое управление формой (элемент ввода или выбора). Этот идентификатор не нужен из этого контекста, но мне нужно создать один идентификатор для совместного использования обоих атрибутов и убедиться, что этот идентификатор уникален в контексте отображаемой страницы. Таким образом, функция lodash работала отлично. На всякий случай полезно для кого-то другого.